/* @font-face{font-family:'Open Sans';src:url(../fonts/OpenSans-Regular.ttf);font-weight:normal;font-style:normal;font-display:block} */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700;800&display=swap');
/* GLobal */
body{background:#fff;font-size:16px;color:#333;font-family: 'Open Sans'}
a, a:hover, a:focus{text-decoration:none}
ul{list-style:none;padding:0;margin:0} 
h1, h2, h3, h4, h5, p{margin:0}
.btn-primary{border-color:#887BE4;background-color:#887BE4;border-radius:8px;padding: 8px 30px}
/* GLobal End */

/* .modal-dialog {
    height: 100vh;
    display: flex;
    align-items: center;
} */
/* Header Start */
header{padding:32px 0}
header .navbar{padding:0}
.navbar-brand{margin:0 78px 0 0;padding:0}
.navbar-light .navbar-nav .nav-link{color:rgba(255,255,255,0.5);font-weight:600;border-bottom:1px solid transparent;padding:0;margin:0 20px}
.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link.active{color:#fff}
.navbar-light .navbar-nav .active>.nav-link{color:#fff}
.topRight li{display:inline-block}
.loginBtn{color:#fff;font-weight:600;font-size:15px}
.startBtn{padding:8px 16px;margin-left:38px;text-align:center;background:#fff;color:#58A4D6;display:block;border-radius:8px;font-size: 14px;font-weight:600}
.startBtn:hover{opacity:0.9}
button.navbar-toggler{outline:0}
/* Header End */

/****** Streamline tracking Section Start *****/
/* .trackingDiv{max-width: 918px;margin: 163px auto 0;text-align: center} */
.trackingDiv>h1{font-size: 50px;font-weight: 700;margin-bottom: 22px;color: #fff}
.mangP{font-size: 22px;color: #fff;max-width:565px}
.efficientDiv{background: #fff;max-width:581px;margin:132px auto 0;padding:21px 40px;box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.1); text-align: center;border-radius: 13px}
.mt112{margin-top:112px}
.carsgroup>img, .videoWrap>img{width:100%}
.videoWrap{max-width:931px;margin:0 auto 95px}
.carsgroup {max-width:430px}

.carsgroup>img{margin-top: -40px}

.effcnt{font-size:16px;color:#192434}
.registerBtn{background-color: #887BE4;color: #fff;border: 0}
.efficientDiv .registerBtn{margin:15px auto}
.countrySec{border:1px solid #eaeaea;border-radius:8px}
.countrySec input{display:inline-block;outline:0;background:none;border:0;height:44px;width:51%;padding-left:20px}
.countrySec > button{height:44px;background:#887BE4;color:#fff;padding:10px 16px;float:right;border:0}
.countrySec > button:hover{opacity:0.7}
.socialUl li{display:inline-block;margin-right:10px}
.socialUl li:last-child{margin-right:0}
.socialUl li a:hover{opacity:0.8}
.socialUl li a img{max-width:160px}
.socialUl li:last-child a img{max-width:183px}
.flagstrap {background: #4A628A;height: 32px;border-radius: 6px;margin: 6px;color: #fff}
.flagstrap ul{transform:inherit !important;top:inherit !important;padding:0}
.flagstrap ul li a{cursor:pointer;padding:3px 8px;display:block}
.flagstrap ul li a:hover{background:#f9f9f9}
.mapImg>img{width:100%}
.mobileApp{display: none}
.countrySec .caret{margin:0 !important}
.countrySec .dropdown-toggle{padding: 0 5px;vertical-align: top}
.countrySec .dropdown-toggle::after{background:url(../images/signup/dropdownDown.png) no-repeat 0 0 /cover;width: 14px;height: 14px}
.countrySec .flagstrap-icon{position: relative;top: -2px}
.countrySec .flagstrap .dropdown-menu{min-width: 2rem}
/****** Streamline tracking Section End *****/


/****** Simple interface. Complete solution. Section Start *****/
.ptbtm{padding:80px 0}
.mt58{margin-top:58px !important}
.topCmp{text-align:center;max-width:756px;margin:0 auto}
.topCmp>h2{font-size: 46px;font-weight: 300;margin-bottom: 30px;color: #192434}
.gBnd{color:#8F08FA;margin-bottom:20px}
.hlpCnt{font-size: 16px;color: #192434;font-weight: 600}
.interfaceDiv{box-shadow: 0px 4px 25px rgb(0 0 0 / 6%);border-radius: 13px;min-height: 255px;background: #fff;padding: 22px 32px}
.intIcn{width:55px;height:55px;border-radius:10px;background:#DBECFE;text-align:center;line-height:50px}
.opShd{background-color: #E5E5FF}
.grShd{background: rgba(253, 113, 211, 0.14)}
.exShd{background: rgba(245, 73, 72, 0.14)}
.gShd{background: rgba(255, 127, 63, 0.15)}
.trShd{background: rgba(149, 205, 65, 0.15)}
.interfaceDiv>h4{margin:25px 0 10px;font-size:20px;font-weight:600}
.intCnt{color:#5A5564}
/****** Simple interface. Complete solution. Section End *****/


/****** Testimonial Section Start *****/
.graygradientBg{background-image:linear-gradient(to top, #ffffff, #fcfcfc, #f9f9f9, #f7f7f7, #f4f4f4)}
.testiDiv{text-align:center;max-width:804px;margin:0 auto}
.testiDiv>img{width:93px;height:93px;border-radius:50%;margin:0 auto}
.userCnt{font-size:20px;font-weight:600;margin:35px 0 45px}
.userName{color:#5A5564;text-transform:uppercase;font-weight:600;margin-bottom:5px}
.designation{color:#8F08FA}
/* Platform Premium Start */
.pt75{padding:75px 0}
.platformDiv{text-align:center}
.platformDiv>h3{font-size: 46px;font-weight: 300;margin-bottom: 30px;color: #192434}
.platformDiv>p{font-size:16px;font-weight:600;color:#192434}
.saveAnnual{margin-left:-560px;margin-top:28px}
.platformDiv .custom-switch{padding-left:0;font-weight: 600;color: #948F9D}
.platformDiv .custom-control-label{margin-left:60px;margin-right:70px;margin-top:-6px}
.platformDiv .custom-switch .custom-control-label::before{width:80px;height:35px;border-radius:30px;background:#E5E6EA}
.platformDiv .custom-switch .custom-control-label::after{top:7px;width:29px;background-color:#887BE4;border-radius:50%;height:29px}
.platformDiv .custom-switch .custom-control-input:checked~.custom-control-label::after{-webkit-transform:translateX(2.80rem);transform:translateX(2.80rem)}
.mt60{margin-top:60px}
.premiumTbl{border-radius: 40px;margin-top: 50px;border: 1px solid #EDEFF3;float: left;width: 100%;display: block}
.premiumTbl thead, .premiumTbl tbody, .premiumTbl tr{display: block}
.premiumTbl thead th{border:0;font-size:22px;color:#192434;border-right:1px solid #EDEFF3}
.premiumTbl td, .premiumTbl th{border-color:#EDEFF3;width:13.33%;float: left;padding:28px .75rem;border-right: 1px solid #EDEFF3}
.premiumTbl tbody td{color:#192434}

.premiumTbl tr th:nth-child(1), .premiumTbl tr td:nth-child(1){width:20%;font-size:14px;color: #6F6F6F;text-align: left;padding-bottom:14px}
.premiumTbl tr th:nth-child(3), .premiumTbl tr td:nth-child(3){background: linear-gradient(174.62deg, #7D60D7 -36.71%, #3fb1c5  136.41%);color:#fff}
.premiumTbl tr th:nth-child(7), .premiumTbl tr td:nth-child(7){border-right:0}
.premiumTbl tr th:nth-child(1){padding-bottom:56px}
.oprtrUl{margin-top:180px;text-align:right}
.oprtrUl li{padding:22px 35px;font-size:20px;font-weight:600;color:#746F7E}
.freePrice{margin-top:38px}
.freePrice li:nth-child(even){background:#fff !important}
.freePrice li:nth-child(odd){background:rgba(74, 98, 138, 0.05)}
.freePrice>li>span{display: none}
.freePrice .premButton{background:#fff;color:#887BE4;border:2px solid #887BE4;transition:all 0.5s ease-in-out}
.freePrice .premButton:hover{background:#887BE4;color:#fff}
.price{background:#fff;border:2px solid #F4F4F4;box-shadow:2px 2px 16px -4px rgba(103, 103, 103, 0.15);border-radius:4px;text-align:left}
.price li{padding:25px 35px;font-weight: 600;color: #5A5564}
.price li:nth-child(even){background:rgba(74, 98, 138, 0.05)}
.price .header{background:#8F08FA;color:#fff;border-radius:4px 4px 0 0;font-size:12px;font-weight:600;text-align:center;padding:10px}
.price .premHead{font-size:28px;font-weight:700;background:none !important;padding:50px 35px}
.premButton{background:#887BE4;font-weight:600;width:100%;display:block;color:#fff;text-align:center;padding:19px 10px;border-radius:4px}
.premButton:hover{opacity:0.8;color:#fff}

.planMobile{border-bottom:1px solid #C2C2C2;display: none}
.planMobile>li{display: inline-block;padding:20px 35px;border-bottom:4px solid transparent;font-size:23px}
.planMobile>li.active{border-color:#887BE4;color:#887BE4}
/* Platform Premium End */


.happyCst {color:#fff;margin-top: 245px}
.happyCst>h4{font-size: 48px;margin-bottom: 8px}
.happyCst>p{font-size:18px}

.quote>img{float: right}
.client-slider{max-width: 570px;background: #fff;margin: 32px 0;padding: 40px}
.client-info>img {width: 56px;height: 56px;border-radius: 50%;display: inline-block}
.client-info>p {display: inline-block;color: #18191F;font-weight: 700;font-size: 18px;vertical-align: middle;margin-left: 16px}
.client-info>p>span {display: block;color: #474A57;font-size: 14px;font-weight: 400}
.cl-review {font-size: 18px;font-weight: 400;margin: 24px 0 55px;color: #18191F;min-height: 145px}
/****** Testimonial Section End *****/


/****** Desktop? Mobile? Yes. Section Start *****/
/* .grayMbBg{
    background:#f6f7f9; 
    background:-moz-linear-gradient(left,  #f6f7f9 1%, #f6f7f9 50%, #ebebeb 50%, #ebebeb 50%, #ebebeb 100%); 
    background:-webkit-linear-gradient(left,  #f6f7f9 1%,#f6f7f9 50%,#ebebeb 50%,#ebebeb 50%,#ebebeb 100%); 
    background:linear-gradient(to right,  #f6f7f9 1%,#f6f7f9 50%,#ebebeb 50%,#ebebeb 50%,#ebebeb 100%); 
} */
.graybBg{background-color: #F6F7F9;padding: 68px 0}
.dsktpDiv{padding-top:60px}
.dsktpDiv>h4{font-size:35px;font-weight:700;margin-bottom:35px;color: #192434}
.dsktpDiv>p{font-size:20px;color:#5A5564;padding-right: 88px}
.dsktpDiv>.registerBtn{margin: 22px 0 66px}
.pr0{padding-right:0}
.desktopDevice>img{width:100%}
.pull-right{float:right}
.pull-left{float:left}
/* .rowPull > .container > .row{display: block} */
.testiBg{background: url(../images/bgH.jpg) no-repeat 0 0 / cover;background-size: 102% 100%}
/****** Desktop? Mobile? Yes. Section End *****/


/****** Footer Section Start *****/
.footer{text-align:center;padding:60px 0}
.footer ul li{display:inline-block}
.ftmngP{font-size:20px;font-weight:600;margin-top: 33px;color: #192434}
.ftNav{margin:60px 0 48px}
.ftNav li a{padding-right:40px;color:#5A5564;font-weight:600}
.ftNav li:last-child a{padding-right:0}
.ftSocial{margin-bottom:86px}
.ftSocial li a{padding-right:22px;color:#948F9D}
.ftSocial li:last-child a{padding-right:0}
.ftprvcy li a{padding-right:2px;color:#948F9D;font-size:14px}
.ftprvcy li:last-child a{padding-right:0}
.ftNav li a:hover, .ftSocial li a:hover, .ftprvcy li a:hover{opacity:0.7}
.copyright{font-size:12px;color:#948F9D;margin-top:18px}
/****** Footer. Section End *****/

/* Modal Start */
.modal{overflow:auto}
.modal-content{border: 0; box-shadow: 2px 2px 16px -4px rgb(103 103 103 / 15%);border-radius: 5px}
.modal-backdrop.show{opacity:.8}
.modal-backdrop{background:#ccc}
.cstmMdl .modal-body{padding:16px 45px}
.cstmMdl .close{position:absolute;right:20px}
.mdlTop{text-align:center}
.mdlTop>h5{font-size:24px;font-weight:600;margin-bottom:40px}
.cstmField>label{display:block;margin-bottom:10px;color:#746F7E;font-size:12px;font-weight: 600}
.cstmField .form-control{border-radius:8px;border-color:#EAEAEA;font-size:14px;color:#746F7E;outline: 0;box-shadow: none;height:44px}
.cstmField .form-control:focus{border-color:#ced4da}
.frgtPwd{text-align:right}
.frgtPwd a{color:#192434;text-decoration: underline}
.frgtPwd a:hover{color:#0056b3}
.loginBtnMdl{background:#887BE4;margin-top:23px;padding: 8px 40px}
.crtAccnt{text-align:center;margin-bottom:25px}
.mdlTop>p{margin-bottom:98px;color:#746F7E;font-weight:600}
.mobileMdl .flagstrap{background:#E5E6EA}
.mobileMdl .countrySec{margin:0 0 16px}
.mobileMdl .loginBtnMdl{margin:0 0 98px}
.mobileMdl .countrySec input{width:78%}
#createAccount .modal-body{padding:16px 85px 60px}
#createAccount .loginBtnMdl{margin:30px 0 0}
.upload{position:relative;text-align:center;margin-bottom:25px}
.upload input{position:absolute;height:100%;width:86px;opacity:0;cursor:pointer}
.upload>img{width:85px;height:85px;border-radius:50%;position:relative;z-index:1;pointer-events:none}

.checkboxLb>label{margin:0 0 0 9px}
input.cstmChekBox{width:16px}
input.cstmChekBox[type='checkbox']:after{line-height:14px;vertical-align:middle;content:'';display:inline-block;width:16px;height:16px;margin-top:-13px;border:1px solid #C4C8D1;border-radius:4px;background:#fff;text-align:center;cursor:pointer}
input.cstmChekBox[type='checkbox']:checked:after{ background: url(../images/tickWhite.svg) no-repeat; background-color:#887BE4 ;background-size: 11px; border-color:#887BE4;background-position: center}
/* Modal End */

/******************************************************
About
******************************************************/
.ptntm60{padding:60px 0}
.grayBg{background:#f4f4f4}
.abtHead{color:#8F08FA !important;margin-bottom:35px;font-size:16px !important}
.abtCmpny>h2{font-size:35px;font-weight:700;margin-bottom:25px}
.abtCmpny>p{font-size:20px;color:#5A5564;margin-bottom:30px}
/* .aoutImg{max-width:500px;margin:0 auto} */
.aoutImg>img{width:100%}
.abtCmpny>p:last-child{margin-bottom:0}
.whiteDiv{text-align:center;padding:60px 10px;background:#fff;border:2px solid #F4F4F4; box-shadow:2px 2px 16px -4px rgba(103, 103, 103, 0.15)}
.whiteDiv>p{font-size:20px;color:#4A628A;margin-top:28px;font-weight:600}
.abourPltfrm{padding:0}
.abtSec .platformDiv>h3{font-weight:700}

.Commitment{text-align:center;margin-top: -130px}
.aboutPage .trackingDiv{margin: 100px auto 0;max-width:840px;text-align:center}
.aboutPage .mangP{max-width:980px}
.comitementUl{margin: 56px 0 120px}
.comitementUl>li{display: inline-block;position: relative;padding-right: 305px}
.comitementUl>li:last-child{padding-right:0}
.comitementUl>li::before{content:'';background-color: rgba(219, 236, 254, 0.5);height:2px;position: absolute;width: 70%;left: 25%;top:28px}
.comitementUl>li:last-child::before, .comitementUl>li:last-child::after{display: none}
.comitementUl>li::after{content:'';position: absolute;left:58%;top:21px;background:#fff url(../images/landing/arrowGray.png) no-repeat 0 0 / cover;width: 16px;height: 17px}
.aboutPage .intIcn{margin: auto}
.aboutPage .footer{padding-top:0}
/******************************************************
FAQ's
******************************************************/
.faqContainer{max-width:809px}
.faqAccordion .card{border:0}
.faqAccordion .card-header{background:none;border-bottom:1px solid #E5E6EA !important;margin-bottom:0 !important;padding:0}
.faqAccordion .card-header>button{font-weight:600;display:block;border:0;padding:40px 20px 20px;background:none;width:100%;text-align:left;outline:0;font-size:18 px;color:#9BA7AF}
.faqAccordion .card-header>button>img{position: absolute;top:50px;right:15px;transform: rotate(90deg)}
.faqAccordion .arrowIcn{transform:rotate(0);transition:all ease-in 0.5s}
.faqAccordion .collapsed .arrowIcn{transform: rotate(-90deg)}

.faqAccordion{max-width: 810px;margin: 0 auto}
.faqPage .topCmp {max-width: 918px}
.faqPage .navbar-light .navbar-nav .nav-link{color:rgba(25, 36, 52, 0.3)}
.faqPage .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link.active{color:#192434}
.faqPage .navbar-light .navbar-nav .active>.nav-link{color:#192434}
.faqPage .loginBtn {color: #887BE4}
.faqPage .startBtn{background:#887BE4;color:#fff}
.faqPage .startBtn:hover{color:#fff;opacity:0.9}
.faqPage .topCmp>h2{font-size: 55px;font-weight: 700}
.faqPage .hlpCnt{font-size:22px}
/**************************************************************
Dashboard Start
***************************************************************/
.user-pop{position: absolute;right: 35%;bottom:20px}
.user-pop ul li{display: inline-block;margin-right:20px;position:relative}
.user-pop ul li:last-child{margin-right:0}
.user-pop ul li>img{width:52px;height:52px;border-radius:50%;border:3px solid #fff;box-shadow: 2px 2px 15px rgba(136, 123, 228, 0.7)}
.user-pop ul li.active>img{border-color:#887BE4}
.close-img{position: absolute; top:-5px;right:-5px;cursor: pointer}
.pop-count{text-align:center;color:#fff;line-height:15px;position:absolute;bottom:0;right:0;font-size:11px;border-radius:50%;width:16px;height:16px;background-color:#887BE4}
/***** Network Section Start ******/
.netdots{width:20px;text-align: center;display:inline-block}
.netdots.dropdown-toggle::after{display:none}
.net-dots-dd{padding: 23px;border-radius: 10px;border-color:#e0e0e0}
.net-dots-dd a{display: block;color:#9BA7AF;font-size:14px;font-weight:600;margin-bottom:16px}
.net-dots-dd a img{margin-right:23px}
.net-dots-dd a:hover{opacity:0.8}
.net-dots-dd a:last-child{margin-bottom:0}

.network{background: #FAFAFA;padding:20px 16px;box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.15);width: 350px;position: fixed;left: -297px;height: 100%;right: 0;transition: all 0.5s ease-in-out;z-index: 1}
.networkShow{left:50px}
.network>h3{font-weight: 600;font-size: 22px; color: #192434}
.netrkUl{margin:21px 0}
.netrkUl>li{display: inline-block;margin-right: 25px}
.netrkUl>li:last-child{margin-right:0}
.netrkUl>li>span{font-size: 20px;color: #192434;font-weight: 800;margin-left: 10px;display: inline-block;vertical-align: middle}
.netrkUl>li>p{font-size: 10px;margin-top:3px;color: rgba(150, 156, 186, 0.94)}

.fltSec{margin-bottom:15px}
.search{position: relative;width:208px;display: inline-block;margin-right: 8px}
.search>img{position: absolute;top: 10px;left: 15px}
.search>input{border: 1px solid #F4F5F6;border-radius: 10px;font-size: 14px;color:#C4C8D1;padding-left: 48px;height: 43px}
.filter{width: 92px;cursor: pointer;border: 1px solid #E5E6EA;border-radius: 10px;height: 43px;padding: 7px 8px;display: inline-block}
.filter>span{font-size: 14px;color: #B0B4BF;margin-left: 5px}
.evntBtn{background: #F4F5F6;padding: 4px;border: 0;border-radius: 10px}
.nav-tabs .nav-link{font-size: 12px;border:0;color: #ABAFBB;font-weight: 600}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active, 
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover{background: #4A628A;color: #fff;border-radius: 10px;border: 0}
.allPrg{margin-top:29px;height: calc(100vh - 270px);overflow: auto}
.allPrg>li{border: 1.5px solid #E5E6EA;padding:10px 14px;border-radius: 10px;position: relative;margin-bottom:15px}
.allPrg>li:last-child{margin-bottom:0}
.allPrg>li>div{display: inline-block;vertical-align: middle;margin-right:11px}
.allPrg>li>div:last-child{margin-right:0}
.allPrg>li>div>span{font-weight: 600;font-size: 10px;color: #ABAFBB}
.allPrg>li>div>p{font-weight: 600;font-size: 12px;color: #423E49}
.allPrg>li>div.name{width:29%}
.allPrg>li>div.date{width:32%}
.allPrg>li>div.location{width:28%}
.allPrg>li>div.name p{ width: 100%;overflow: hidden;white-space: nowrap;text-overflow: ellipsis}
.date>span>img{margin-right:5px}
.location>p{background: #887BE4;border-radius: 6px;font-size:10px !important;padding: 4px 11px;color: #fff !important}
.location>img{margin-right:5px}
.indicator::before{content:'';position:absolute;left:-2px;top:16px;width:4px;height:31px;border-radius:5px;background: #00D37D}
.redBgInd::before{background-color: #FF1856}
.amberBGInd::before{background-color: #FFB934}
/***** Network Section End ******/
/* Left Side Start */
.leftSide{position:fixed;height:100%;width: 55px;padding: 20px 0;float: left;background-color: #F0F4F5;border: 1px solid #E8EEF0;border-radius: 0px 8px 8px 0px; transition: all 0.3s ease-in-out;z-index:1;white-space: nowrap}
.widthIncr.leftSide{width: 233px}
.networkSlide{position: absolute;top: 15px;left:350px}
.networkShow .networkSlide{transform: rotate(180deg);left: 334px}
.arrowSlide{position: absolute;bottom:0;top:0;margin:auto;width:60px;height:60px;right: -33px}
.dbLogo{padding: 0 8px 30px;display: inline-block}
/* .dbLogo>img{max-width:140px} */
.cmpName{background:#fff;padding:10px 25px 10px 10px;border-radius:5px;box-shadow: 2px 2px 16px -4px rgba(103, 103, 103, 0.15)}
.cmpName>img{width:30px}
.cmpName>span{font-size:14px;font-weight:600;margin-left:3px}

.dbUl{height: calc(100% - 384px)}
/* .dbUl li{margin-bottom:14px} */
.dbUl li a{font-weight:600;color:#9BA7AF;border-left:2px solid transparent;  padding: 10px 18px;display: block;position: relative}
.dotsMsg{position: absolute;opacity: 1 !important;top:13px;left:21px;background-color:#ED8A17;width:8px;height:8px;border-radius:50%;display: inline-block}
.dbUl li a> img {margin-right: 18px}
.dbUl li a span{margin-left:14px;vertical-align: middle}

.dbUl li:first-child a span, .dbUl li:nth-child(2) a span{margin-left:9px}
.leftBtm .dbUl li a span{margin-left:14px}
.leftBtm .dbUl li.prmLi a span{margin-left:10px}
.dbUl li a:hover, .dbUl li.active a{color:#4A628A;border-color:#4A628A;background-color:rgba(74, 98, 138, 0.14)}
.dbUl li.active a img{filter: invert(0%) sepia(1%) saturate(10%) hue-rotate(10deg) brightness(64%) contrast(97%)}
.dbUl li.avatarImg.active a img{filter: inherit}
.notCount{width:23px;height:23px;border-radius:50%;background:#887BE4;font-size:12px;font-weight:600;display: inline-block;color: #fff;font-style: inherit;text-align: center;line-height: 23px}

/* .leftBtm{margin-top:150px} */
.avlDiv{border-top: 1px solid #E1E7E9;margin:19px -18px 0;padding:0 18px 18px}
.prmLi {padding: 0 14px}
.prmLi a{background: linear-gradient(145deg, #7028E4 4.71%, #B195C8 95.3%);border-radius: 64px;padding: 8px 13px;display: inline-block;color: #fff;font-size: 12px;font-weight: 600}
.userImg{width: 40px;height: 40px;background: #E5E6EA;border-radius: 5px;text-align: center;line-height: 40px;float: left}
.userImg>img{width:21px;height:21px;border-radius:50%}
.userNme{float: left;margin-left:12px}
.mgnm{font-weight:600;color:#000}
.avalSec{color:#5A5564;font-weight:400;font-size:12px}
.avalSec span{background: #00D37D;margin-right:5px;width:7px;height:7px;border:1px solid #948F9D;display: inline-block;border-radius:50%}
.avalSec>img{width: 6px;transform: rotate(180deg);margin-left: 6px}
.dbUl .avatarImg a>img{margin-right: 8px}
.dbUl .avatarImg a{color:#192434}
.dbUl .avatarImg a span{overflow: hidden;text-overflow: ellipsis;display: inline-block;white-space: nowrap;width: 71%}

.leftSide .dbUl li a{padding:10px 13px}
.leftSide .dbUl li a span{opacity: 0}
.leftSide .dbUl li a span i{width:18px;height:18px;background-color:#4A628A;border-radius:3px;color: #fff;font-style: initial;text-align: center;line-height: 18px;font-size: 10px;float: right;margin: 5px 0 0}
.leftSide .dbUl .avatarImg a {padding: 10px 8px}
.leftSide .prmLi {padding: 0 9px}
.leftSide .prmLi a{width: 34px;height: 34px;text-align: center;padding: 8px 0}
.leftSide .prmLi a span{display: none}

.leftSide .avlDiv{margin: 19px 0px 0;padding: 0 0 18px}
.widthIncr.leftSide .prmLi a{width: auto;height: auto;padding: 8px 13px}
.widthIncr.leftSide .prmLi a span{display: inline-block}
.widthIncr .dbUl li a span{opacity: 1}
.leftarrow{transform: rotate(180deg);transform-origin: 47% 47%}
/* Left Side End */

/* Right Side Start */
.rightSide{margin-left: 55px;height:100%}
.overHead{font-weight:600;color:#192434;font-size:22px;margin-bottom: 23px}
.netevBn{float: left;margin-right: 25px}
.overHead span{font-size:12px;color:#746F7E;margin-left:20px;font-weight:600}
.optDiv{background:#fff;padding:10px 11px;box-shadow: 1.54686px 1.54686px 12.3749px -3.09371px rgba(103, 103, 103, 0.15);border-radius: 7.73428px}
.optImg{float: right}
.optCnt{float: left;color: #948F9D;font-weight: 600;font-size: 11px}
.optCnt>span{font-size:20px;font-weight: 800;display: block;color: #423E49;line-height:26px}

/* Map Activities */
.btn.focus, .btn:focus{box-shadow: none}
.mt17{margin-top:17px}
.srchOprt{background: #fff;padding: 15px;border-radius: 5px 5px 0 0}
.srchSec{display: inline-block;width: auto;margin: 0}
.multiDd{display: inline-block;margin: 0;vertical-align: top;margin:0 0 0 30px}
.srchSec input{background: #F4F4F4;width: 354px;float: left;height:44px}
.srchSec input:focus{box-shadow: none;border-color:#C4C8D1 }
.srchSec>.btn{background: #887BE4;color: #fff;font-weight: 600;margin-left: -10px;border-radius: 8px;padding: 11px 18px;line-height: 20px;position: relative}
.tt-menu{border-top: 1px solid #e0e0e0;width: 100%;background: #fff;padding: 0 15px}
.tt-suggestion{padding: 2px 0;cursor: pointer}
/*--------- Multiselect DropDown -----*/
button.multiselect{padding:9px 15px;background:#fff;border-radius:4px}
button.multiselect:focus, .button.multiselect:hover, .open>.dropdown-toggle{box-shadow:none }
span.hide-native-select{position:relative}
span.hide-native-select select{border:0!important;clip:rect(0 0 0 0)!important;height:1px!important;margin:-1px -1px -1px -3px!important;overflow:hidden!important;padding:0!important;position:absolute!important;width:1px!important;left:50%;top:30px}
.multiselect-container{display:none;border-top-right-radius:0;border-top-left-radius:0;position:absolute;margin-top:-1px;width: 100%}
.multiselect-container{padding: 20px;box-shadow: 2px 2px 16px -4px rgba(103, 103, 103, 0.15);border-radius: 4px}
.multiselect-container>li{margin-bottom: 11px}
.multiselect-container>li:last-child{margin-bottom: 0}
.multiselect-container>li>a.multiselect-all label{font-weight:700}
.multiselect-container>li.multiselect-group label{margin:0;padding:3px 20px 3px 20px;height:100%;font-weight:700}
.multiselect-container>li.multiselect-group-clickable label{cursor:pointer}.multiselect-container>li>a{padding:0}
.multiselect-container>li>a>label{margin: 0;height: 100%;cursor: pointer;font-weight: 400;font-size: 16px;color: #746F7E}
.multiselect-container>li>a>label.checkbox{line-height:23px}
.multiselect-container>li>a>label.radio,.multiselect-container>li>a>label.checkbox{margin:0}
.multiselect-container>li>a>label>input[type=checkbox]{margin-right: 10px}
.btn-group>.btn-group:nth-child(2)>.multiselect.btn{border-top-left-radius:4px;border-bottom-left-radius:4px}
.form-inline .multiselect-container label.checkbox,.form-inline .multiselect-container label.radio{padding:3px 20px 3px 40px}
.form-inline .multiselect-container li a label.checkbox input[type=checkbox],.form-inline .multiselect-container li a label.radio input[type=radio]{margin-left:-20px;margin-right:0}
.multiselect .caret{ float:right; margin-top:7px}
.dropdown-menu>.active>a{ color:#000 !important; background:transparent !important}
span.multiselect-selected-text{font-size: 14px;font-weight:400;color: #5A5564}
/*--------- Multiselect DropDown End -----*/
.dropdown-toggle::after{background: url(../images/arrowDown.svg) no-repeat 0 0 /cover;border: 0;width:10px;height:6px;position: relative;top: 2px}

.expnd{float: right}
.expnd>button>img{margin-right:3px;vertical-align: inherit;margin-top: -2px}
.expnd>#fullScreen{background:#887BE4;font-weight:600;padding:8px 16px;color:#fff;border-radius: 8px}
.expnd>button:hover{color:#fff;opacity:0.8}
.fullVH #fullScreen, #outScreen{display: none}
.fullView{margin-bottom: 60px}
/* .fullView, .map{height: calc(100vh - 90px)} */
.fullVH #outScreen{display: inline-block}
.fullVH .expnd>button>img{ width: 50px}
.fullVH .srchOprt{position: absolute;background: none;width: 100%;z-index:1}

.map{position: relative;height:100%}
.fullVH .map{height: 100%}

/* Map bottom Right (Ready, In Transit, Inactive)*/
.fltBtm{position: absolute; left:20px; bottom:20px; padding:10px 29px 10px 10px; background: #FFF;box-shadow: 2px 2px 16px rgba(103, 103, 103, 0.15);border-radius: 4px}
.fltBtm ul li{font-weight: 600;font-size: 12px;color:#000;margin-bottom:6px}
.fltBtm ul li:last-child{margin-bottom:0}
.fltBtm ul li span, .circle{width:10px;height:11px; position:relative;border-radius:50%;background:#000; display: inline-block}
.fltBtm ul li span i, .circle i{width:6px;height: 5px;border-radius:50%;background:#fff;position: absolute;left: 0;right: 0;margin: auto;bottom: 0;top: 0}
.greenBg{background:#00D37D !important}
.amberBg{background:#FFB934 !important}
.redBg{background:#FF1856 !important}


.userPointer .circle{position: absolute;bottom: -34px;left: 0;right: 0;margin: auto}
.circle{width:20px;height:20px}
.circle i{width:10px;height:10px}

/* Map Zoom Control */
.shortLogo{position: absolute;right:0;top:20px; }
.zoomDiv{position: absolute;right:34px;top:90px; }
.zoomDiv ul li{cursor:pointer;width:33px;height:33px;color:#4A628A; font-size: 17px;font-weight: 700;text-align: center;line-height: 31px; background:#fff;border-radius: 4px;margin-bottom:10px}
.zoomDiv ul li img{width:17px}
.zoomDiv ul li:last-child{margin-bottom:0}
.directionImg{position: relative}
.mapDirection{display:none;position: absolute;top:120px;right:74px;background: #fff;box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.07);border-radius:8px;padding:12px}
.mapDirection>li{margin-bottom:10px;cursor: pointer;border:2px solid transparent;border-radius:6px;position: relative}
.mapDirection>li::before{display:none;width: 15px;height: 15px;top: 5px;left: 5px;content:'';position: absolute;background: url(../images/dashboard/home/tick1.svg) no-repeat}
.mapDirection>li.active{border-color:#887BE4}
.mapDirection>li.active::before{display:inline-block}
.mapDirection>li:last-child{margin-bottom:0}

/* Map Location Control */
.locDes{padding:10px;background:#4A628A;border-radius:5px; position: absolute; top:50px;left:20px}
.locDes::after{content:''; position: absolute;bottom:-10px; left:0;right: 0;margin: auto; width: 0;height: 0;border-style: solid;border-width: 10px 5px 0 5px;border-color: #4A628A transparent transparent transparent}
.closePop{position: absolute;right: 10px;cursor: pointer;width:9px}
.userPointer{left:40%}
.userPointer img{width:34px;float: left}
.userPointer p{font-size:12px;color:#fff;float: left;margin-left: 5px;padding-right: 10px}
.userPointer p span{display: block;margin-top: 2px}
.mpUser{display: inline-block}
.mpDtl{display: inline-block;vertical-align: top;margin-left: 9px;margin-right:10px}
.mpName{font-size:12px;color:#fff}
.mpName span{margin-left: 19px;cursor: pointer}
.mpDate{font-size:12px;color:#C4C8D1;font-weight:600}
.mpUser img{width:28px}
.mpName span img{width:16px}
.mpTop{margin-bottom:12px}
.mpMiddle ul li{display: inline-block;font-size:12px;font-weight:600;color:#E5E6EA;margin-right:10px;margin-right: 20px}
.mpMiddle ul li:last-child{margin-left:0}
.trnsit{width:64px;font-size:10px;text-align: center;font-weight:800; padding:5px;background: rgba(242, 153, 74, 0.18);border-radius: 4px;color: #FFB934}
.transitgreen{background: rgba(101, 228, 176, 0.18) !important;color:#00D37D !important}
.mpLOc{font-size:12px;font-weight:600;margin-top:14px;color:#fff;text-decoration: underline;cursor: pointer}
.moreDiv{cursor: pointer;margin-top:16px; font-size:12px;color:#fff;font-weight: 600}
.moreDiv img{float: right}

.mainActionDiv{background: #4A628A;position: absolute;bottom:0;margin-left: 13px;left: 100%;width: 196px; border-radius:6px; padding:19px 21px;box-shadow:0px 0px 4px rgba(43, 43, 43, 0.25)}
.mainActionDiv .custom-switch{padding-left:0;font-size: 12px;color: #fff}
.custom-switch .custom-control-label::after{background-color:#887BE4}
.custom-control-label::before{background-color: #F4F4F4}
.mainActionDiv .custom-control-label{left:50px;top: -3px}
.custom-control-input:focus:not(:checked)~.custom-control-label::before, 
.custom-control-input:focus~.custom-control-label::before{box-shadow: none;border-color:#adb5bd }
.actionUl li>a{color:#C4C8D1;margin-top:7px;font-size:12px}
.actionUl li img{margin-right:11px}

.dotsDiv{padding:13px 15px;position: absolute;box-shadow: 0px 0px 4px rgba(160, 160, 160, 0.25);background: #4A628A;right:-162px;bottom: 0;border-radius: 5px}
.dotsUl li{color:#fff;font-size:12px;font-weight:600;margin-bottom:9px}
.dotsUl li label{font-size:8px;color:#C4C8D1;display: block;margin-bottom:3px}
.dotsUl li:last-child{margin-bottom:0}
.dotsUl li .btn{background: #887BE4;border-radius: 6px;font-size: 12px;color: #fff;padding:4px 13px}
.dotsUl li .btn img{margin-right:0}
.chatAction{display: inline-block}
.chatAction>li{display: inline-block}

/* Set alarm Modal Css */
.alarmMdl .modal-dialog{max-width: 388px}
.alarmMdl .close{opacity: 1;margin-top: -10px}
.alarmMdl .close img{width:12px}
.alarmMdl .modal-body{padding: 25px}
.alarmHead{font-size: 24px;font-weight: 600;color: #192434;margin: 0 0 4px}
.addAlarm{color:#746F7E;font-weight:400;margin-bottom: 25px}
.alarmMdl .form-group{margin-bottom: 20px}
.alarmMdl .form-control{padding: 8px 10px;color:#746F7E;font-size:13px;height: inherit}
.alarmMdl ::-webkit-input-placeholder{ /* Chrome/Opera/Safari */color: #746F7E}
.alarmMdl ::-moz-placeholder{ /* Firefox 19+ */color: #746F7E}
.alarmMdl :-ms-input-placeholder{ /* IE 10+ */color: #746F7E}
.alarmMdl :-moz-placeholder{ /* Firefox 18- */color: #746F7E}
.width60{width:60%}
.cstmDiv{border:1px solid #C4C8D1; border-radius:4px}
.cstmDiv select.form-control, .cstmDiv input.form-control{width:50%;height: 36px;float: left;border-radius:0;border:0}
.cstmDiv select.form-control{padding: 0 0 0 15px;background: #fff;border-radius: 4px 0 0 4px}
.cstmDiv input.form-control{border-radius: 0 4px 4px 0;border-left: 1px solid #C4C8D1}
.alarmMdl .checkboxLb{margin-bottom: 20px}
.alarmMdl .checkboxLb label{font-weight: 600;color: #5A5564}
.alarmMdl input.cstmChekBox[type='checkbox']:after{border: 1px solid #948F9D;border-radius:4px}
.alarmBtn{margin-top:29px}
.alarmBtn .btn.btn-primary{font-weight: 600;background: #887BE4;padding:8px 18px;color: #fff;border-radius: 10px}
.alarmBtn .btn.btn-primary img{margin-left: 11px}
.alarmBtn .btn{font-weight: 600;color: #909090}
/* Set alarm Modal Css End */
/* Right Side End */


/* History Css Start */
.breadcrumb{padding: 0;border-radius: 0;margin: 0 0 10px;background: none}
.breadcrumb li{font-size: 14px;font-weight: 600;color:#948F9D}
.breadcrumb li a{color:#887BE4}
.ophHead{font-size:24px;color:#5A5564;font-weight: 600;margin-bottom: 20px}
.historyDiv{margin:0}
.historyDiv .map{height: calc(100vh - 0px)}
.audioBtn{display: inline-block;width: 29%}
.audioPlayer{background:#fff; padding:14px 32px;max-width:1133px;margin:-5px auto;box-shadow: 1.73224px 1.73224px 13.8579px rgba(103, 103, 103, 0.15);border-radius: 10px;position: absolute;bottom:30px;left: 0;right: 0}
.audioBtn>img{cursor: pointer;margin-right: 17px}
.audioBtn>img:last-child{margin-right:0}
.audioBtn>p{display: inline-block;font-weight:600;margin-left:33px}
.audioSlide{display: inline-block;width: 70%;position: relative}
.slider-selection{background: #887BE4 !important;box-shadow: none}
.slider.slider-horizontal{width: 100% !important}
.slider.slider-horizontal .slider-track{background: #E5E6EA;box-shadow: none;height: 4px}
.slider-handle{margin-top: -2px;background-color: #887BE4  !important;background-image: none;width:18px;height:18px}
.operatorHistory{background: #fff;padding:29px 25px;position: absolute;bottom:100px;right:40px;box-shadow: 1.73224px 1.73224px 30px -3.46448px rgba(103, 103, 103, 0.15);border-radius: 10.0154px}

.operatorHistory>h3{font-size: 16px;color: #192434;margin-bottom: 22px;font-weight: 600}
.opSEC{margin-bottom:30px}
.opSEC>table{margin:0}
.opSEC:last-child{margin-bottom:0}
.opSEC>p{font-size: 14px;margin-bottom: 10px;color: rgba(150, 156, 186, 0.94);font-weight: 600}
.operatorHistory .table tr td{font-size:11px;color:#9BA7AF;font-weight: 400;padding: 10px 25px;border: 0;vertical-align: bottom}
.operatorHistory .table tr td:first-child{padding-left:0}
.opDiv>img {display:inline-block;margin-right: 18px}
.opUserh {display:inline-block;vertical-align: bottom}
.opusername{color:#192434;font-size:14px !important;font-weight:600}
.opUserh>span {display: block;font-size: 11px}
.opUserh>span>img{margin-right:6px}
.viewAll {text-align: center}
.viewAll a{font-size: 14px;color:#887BE4;font-weight: 600}
/* History Css End */

/* Time Arrival */
.timeArrival{background: #fff;width: 358px;position: absolute;bottom: 100px;left: 118px;box-shadow: 1.54644px 1.54644px 15.4644px rgba(103, 103, 103, 0.2);border-radius: 18.73218px;}
.timeArrival table{margin:0}
.timeArrival table tr td{vertical-align: bottom;border: 0}
.time{font-size: 19px;font-weight: 700;color: #333;padding: 0 25px}
.time>span{display: block;font-size: 11px;color: #948F9D;font-weight: 600}
.upArrow {padding: 0 28px;margin-bottom: 15px}
.timeDots{position: absolute;right: 20px;top: 10px}
/* Time Arrival End */
/* Datepicker Css Start */
.Datepicker{border:1px solid #F4F5F6;background:#fff;border-radius:10px;position:relative;display: inline-block;width: 338px;cursor: pointer;box-shadow: 1.73224px 1.73224px 13.8579px rgba(103, 103, 103, 0.15)}
.Datepicker span{width: 50px;display: inline-block;text-align: center;height: 38px;vertical-align: top;border: 0}
.Datepicker input, .Datepicker input:focus{width: calc(100% - 55px);padding-left:0;outline:0;box-shadow:none;cursor:pointer;display: inline-block;border: 0;background: none}
.Datepicker i img{position: absolute;right: 20px;margin-top: 17px;display: inline-block}
.daterangepicker{font-family: 'Open Sans'}
.daterangepicker .calendar-table th, .daterangepicker .calendar-table td{width: 28px;height: 28px;line-height: inherit;min-width: 21px}
.daterangepicker .calendar-table td.active, .daterangepicker .calendar-table td.active:hover{background: #887BE4;border-radius: 50%;color:#fff}
.daterangepicker .drp-selected{display: none}
.daterangepicker.show-calendar .ranges{float: right;margin: 0;padding: 20px;padding-right:0}
.daterangepicker.show-ranges.ltr .drp-calendar.left{border:0}
.daterangepicker .drp-calendar.right{border-right: 1px solid #ddd}
.daterangepicker .ranges li{position:relative;color: #746F7E;padding-left: 0}
.daterangepicker .ranges li.active, .daterangepicker .ranges li:hover{color:#000;font-weight:600;background: none}
.daterangepicker .ranges li.active::after, .daterangepicker .ranges li:hover::after{position: absolute;right:18px;top:10px;width:11px;height:9px; content:'';background: url(../images/dashboard/network/tickBlue.png) no-repeat}
.daterangepicker .drp-buttons .btn{font-size: 16px;padding: 8px 18px;font-weight: 600}
.daterangepicker .drp-buttons .btn.btn-primary{background:#887BE4}
.cancelBtn{color: #C4C8D1}
th.prev.available, th.next.available{background: #F4F4F4;width: 31px;height: 31px;border-radius: 50%}
.daterangepicker .drp-buttons{border: 0;padding: 20px}
.daterangepicker .calendar-table th{color: #948F9D;font-weight: 400}
.daterangepicker .calendar-table td{color: #4F4F4F;font-weight: 600}
.daterangepicker .calendar-table th.month{font-size:12px;color:#000;font-weight: bold}
.daterangepicker .calendar-table .next span, 
.daterangepicker .calendar-table .prev span{border:0;background: url(../images/dashboard/network/cArrow.png) no-repeat;width: 13px;height: 9px;transform: rotate(0deg)}
.daterangepicker .calendar-table .prev span{transform: rotate(180deg)}
.daterangepicker .drp-calendar.left{padding: 20px 0 0 20px}
.daterangepicker .drp-calendar.right{padding: 20px 20px 0px}
.daterangepicker .calendar-table thead tr:last-child th{padding-top: 20px;padding-bottom:10px}
.daterangepicker .calendar-table td.off, 
.daterangepicker .calendar-table td.off.in-range, 
.daterangepicker .calendar-table td.off.start-date, 
.daterangepicker .calendar-table td.off.end-date{color:#fff}
/* Datepicker Css End */ 

/* Custom Chat */
.cstmChat{width:363px;position: fixed;bottom: 0;right: 40px;border-radius:4px 4px 0 0;z-index:1}
.cstmCHatHead{background: #887BE4;color:#fff;font-weight:600;border-radius:4px 4px 0 0;position: relative}
.headArea {display: inline-block;cursor: pointer;width: 68%;padding:8px 16px}
.headRight a{padding:8px 16px}
.headRight a:first-child{padding-right:0}
.notify{position: absolute;top:-10px;left:-10px}
.cstmCHatHead>p{float:right}
.cstmCHatHead>p>a{display: inline-block}
.cstmCHatHead>p>a:first-child{margin-left:0}

.chatMiddle{background:#fff}
.chatMiddle .notiUl>li{padding:15px;margin:0;cursor: pointer;border-bottom: 1px solid #E5E6EA}
.chatMiddle .notiUl>li>p:nth-child(2){vertical-align: top}
.chatMiddle .notiUl>li.error {background: #FFECEC}
.chatMiddle .notiUl>li>p>span{display: block}
.rotate{transform: rotate(180deg);transform-origin: 80% 54%}
/* .chatMiddle{overflow: inherit} */
.userChat{padding:8px 16px;position: relative;height: calc(100vh - 244px);position: absolute;right: 370px;bottom: 0;background: #fff;width: 365px}
.dayHead{color:#C4C8D1;font-size: 10px;font-weight:600;text-align: center;border-bottom: 1px solid #E5E6EA;margin-bottom: 27px}
.dayHead span{display: inline-block;position: relative;top: 8px;background: #fff;padding: 2px 31px}
.userChat .msgDiv{max-width:253px;padding:10px}
.userChat .your .msgTime{text-align: right}
.userChat .your .msgDiv {background: #D9EFFF;color: #333;border: 1px solid #73C4FF}
.userChat .chatting{padding:0}
.userChat .chatMiddleArea{padding-bottom: 0;height: 253px;overflow: auto}
.userChat .chatMiddleArea .chatMd{position: static}
.userChat .chatMd>div {margin-bottom: 6px}
.userChat .chatbottomArea{border-top:1px solid #E5E6EA;margin: 0 -16px;padding:16px;position: absolute;bottom: 0;width: 100%;background: #fff}
.userChat .chatbottomArea textarea{border:0;height: 40px;padding: 0;width: 85%}
.userChat .chatbottomArea .btn{position: absolute;right: 0;top: 20px;color: #887BE4;font-weight: 600}
.arrowLeft{position: relative;cursor: pointer;left: 14px}
.headArea .online{width: 6px;height: 6px;border: 0;vertical-align: middle}

.chatCircle{position: absolute;cursor: pointer;display: inline-block;bottom: 70px;right: 40px}
.chatCircle>span{ position: absolute;right:0;top:0;width:14px;height:14px;background-color:#ED8A17;border-radius:50%;font-size:9.6px;color:#fff;text-align: center;line-height:14px;display: inline-block}
/* .chatUser {height: 420px;overflow: auto;padding: 0 10px} */
.chatUser .search{display: block;width: 100%;margin: 15px 0}
.msgD>img{width:24px;height:24px;border-radius:50%}
.usrDivBg>span{width: 60px;height:53px;border-radius:4px;border:1px solid #E5E6EA;display: inline-block}
.usrDivBg>span>img{width: 100%}
.usrDivBg>P{font-weight: 700;color:#000;font-size:20px;display: inline-block; margin-left:20px; vertical-align: top}
.usrDivBg>p span{font-size:12px;color:#948F9D;display: block;font-weight: 400;margin-top: 5px}
.cstmChat .notiUl>li>p>img {width: 37px;height:37px;border-radius: 50%}
.cstmChat .notiUl>li>p:nth-child(2){padding-left: 15px;width:66%}
.cstmChat .chatMiddle .notiUl>li{border-radius:0;position: relative}
.cstmChat .ntrad{right:15px}
.cstmChat .notiUl {height: 420px;overflow: auto;padding: 0 10px}
.cstmChat .chatUser .search{margin: 15px auto;max-width: 325px}
.cstmChat .online{width:13px;height:13px}
.cstmChat .notiUl>li>p:first-child{position: relative}
.cstmChat .notiUl>li>p:first-child span {width: 13px;height: 13px;position: absolute;right: -3px;bottom: -3px}

.cstmChat .userChat{padding:0;height: inherit}
.chat-headr{background: #fff;padding:9px 16px;box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.06)}
.chat-headr .usrDivBg>span {width: 40px;height: 39px;position: relative;border-radius: 50%}
.chat-headr .usrDivBg>P{margin-left:12px}
.chat-headr .usrDivBg>P{font-weight: 600;margin-left: 12px;font-size: 14px}
.chat-headr .usrDivBg>p span{margin-top: 0}
.chat-headr .online {width: 11px;height: 11px;position: absolute;bottom: 0;right: 0}
.chat-headr .groupDots>a{margin: 6px 0 0 20px;display: inline-block}
.cstmChat .dayHead{border:0;font-size:12px;font-weight:500}
.cstmChat .userChat .chatting {padding: 0 16px}
.cstmChat .userChat .chatMiddleArea{height:440px}
.cstmChat .userChat .your .msgDiv{background: #F4F4F4;border: 1px solid #F4F4F4;border-radius: 15px 15px 15px 0}
.cstmChat .userChat .chatbottomArea{padding:13px 0;border:0;position: static;margin:0}
.cstmChat .enter{display: inline-block}
.cstmChat .userChat .chatbottomArea textarea{width: 76%;display: inline-block;vertical-align: middle;border: 1px solid #C4C8D1;padding: 5px}
.cstmChat .userChat .chatbottomArea .btn{display: inline-block;vertical-align: middle;padding: 0;position: static}
/* Custom Chat End */

/**********************
Operator Dashboard
************************/
.operatorSec{padding: 16px 39px 36px 60px}
.netLogo {float: right;margin-right: -31px}
.chnageBtn{margin-top: 10px;border-color:#C4C8D1}
.chnageBtn, .chnageBtn .nav-item{display: inline-block}
.chnageBtn .nav-link, .chnageBtn .nav-link:focus, .chnageBtn .nav-link:hover{border: 0;border-radius: 0;border-bottom: 5px solid transparent;color: #746F7E;text-transform: uppercase;font-weight: 700;font-size: 14px}
.chnageBtn .nav-item.show .nav-link, 
.chnageBtn .nav-link.active{background: none;border-color: #887BE4;color: #887BE4}
.operatorSec .overHead.mt17{margin-top: 40px}
.operatorSearch{margin-top:19px}
.operatorSearch .srchSec input{background: #fff !important}
.operatorSearch button.multiselect{background: none}
.optList{margin-top:24px;background: #fff;padding: 0 37px;box-shadow: 1.73224px 1.73224px 13.8579px -3.46448px rgba(103, 103, 103, 0.15);border-radius: 10.0154px}
.table td, .table th{border-color: #F4F4F4;padding: 12px 5px}
.networkTbl thead th{font-size:12px;font-weight:600;color:#9BA7AF;text-transform: uppercase;border: 0}
.networkTbl thead th img{cursor: pointer;vertical-align: text-bottom}
.empname {display: inline-block;cursor: pointer}
.empname>img{margin-right:33px;border-radius:6px}
.empname>span{font-size:14px;color:#192434;font-weight:600}
.empcall>img{margin-right:9px;vertical-align: bottom}
.empcall>span{font-size:14px;color:#192434;font-weight:400}
.emptask{font-size:14px;color:#192434;font-weight:600}
.empadd>img{margin-right:7px}
.empadd>span{font-size:14px;color:#192434;font-weight:400}

.optDiv{background: #FFF;box-shadow: 2px 2px 16px -4px rgba(103, 103, 103, 0.15);border-radius: 5px}
.operatorSearch .optDiv{padding:11px 20px}
.optTop .optImg {margin-right: 15px;border:0}
.optTop .optImg img{ width: 74px; height: 70px; border-radius:4px}
.inviteMdl .cstmField>label{font-weight: 600;font-size: 12px}
.optDetails span{display: inline-block;text-transform:uppercase;color: #00D37D;font-size: 10px;font-weight: 600;background: rgba(101, 228, 176, 0.18);border-radius: 4px;padding: 5px 7px;margin-bottom: 3px}
.optDetails h3{font-size: 20px;color: #000;margin-bottom:2px;font-weight: 600}
.optP{font-size: 12px;color: #8F08FA}
.optP img{vertical-align: sub}
.optUl{border-top: 1px solid #E5E6EA;margin: 16px -20px 0;padding: 15px 20px 0}
.optUl>li{padding-right: 47px;display: inline-block}
.optUl>li:last-child{padding-right:0}
.optUl>li h4{font-size: 20px;font-weight: 700;color: #333;margin-bottom: 4px}
.optUl>li p{font-size: 12px;color:#948F9D;font-weight: 600}
.optUl>li p img{vertical-align: sub}
.netMdl .modal-dialog{max-width:626px}
.netMdl .modal-body {text-align: center;padding:25px}
.netMdl .alarmHead{text-align: left}
.opUser{margin-top: 15px}
.opUser>img{margin-bottom:22px}
.ophead{margin-bottom:11px;font-size: 22px;color: #000;font-weight:600}
.netMdl .optDetails{vertical-align: bottom;width: auto}
.opimg{color: #887BE4;font-size: 14px;font-weight:600}
.opimg>img{vertical-align: sub;margin-right:5px}
.opP{margin-top: 26px}
.opP>li{display: inline-block;margin-right:12px;padding:7px 17px;border-radius: 10px;width:31.4%;text-align: left}
.opP>li:last-child{margin-right:0}
.netMdl .acP{text-align: left}
.skyBg{background-color: #DBECFE}
.greenBgp{background-color: #D3FFDA}
.blueBg{background-color: #E5E5FF}
.opHead{font-size: 30px;font-weight: 700}
.optext{font-size:15px}
.optext>img{margin-right:6px}
.skyBg .opHead{color: #8FC5FF}
.greenBgp .opHead{color: #63E2CA}
.blueBg .opHead{color: #8267E7}
.opTask{margin-top: 28px;text-align: left}
.opTask>p{font-size: 13px;font-weight: 600;color: #A7A7A7;margin-bottom: 10px}
.opTask>ul>li{position: relative;background: #F4F5F6;padding: 15px 8px 15px 34px;margin-bottom: 8px;border-radius: 10px;font-weight: 600;color: #333}
.opTask>ul>li:last-child{margin-bottom:0}
.opTask>ul>li::before{width:5px;height:5px;background-color:#333;content:'';position: absolute;left: 20px;top: 26px}
.opTask>ul>li>span{display: block;color: rgba(0, 0, 0, 0.6);font-size: 14px;font-weight: 400;margin-top: 9px}
.inviteMdl .alarmBtn .btn.btn-primary img{margin:0 8px 0 0}
/* Pagination */
.pagination{ text-align: center; margin-top:46px; display: block}
.pagination>li{display: inline-block}
.pagination>li img{cursor: pointer;margin-top: -3px}
.pagination>li a{font-size:16px;font-weight: 400;color:#948F9D;width: 29px;height: 29px;border-radius: 7px;line-height: 29px;display: block;text-align: center}
.pagination>li.active a{color:#887BE4;font-weight:800;background-color:#E5E5FF}
.pagination>li.previous{margin-right: 36px}
.pagination>li.previous a{color:#746F7E;font-weight: 600;padding-left: 12px;width: auto;height: auto}
.pagination>li.next{margin-left:36px}
.pagination>li.next a{color:#746F7E;font-weight: 600;padding-right: 12px;width: auto;height: auto}
/* Pagination End */
/* Invitation Modal */
.inviteMdl .modal-dialog {max-width: 440px}
.inviteMdl .modal-body {padding: 30px}
.inviteMdl .close {position: absolute;right: 30px;opacity: 1}
.inviteMdl .alarmHead {font-size: 24px;font-weight: 600;color: #000;margin: 0 0 23px}
.inviteDiv{margin-top:34px}
.invitesBtn{border-radius:8px;background-color:#F4F5F6;padding:3px;border:0}
.invitesBtn .nav-link, 
.invitesBtn .nav-link:focus, 
.invitesBtn .nav-link:hover{border:0;text-transform: capitalize;background: inherit;border-radius: 10px; position: relative;font-weight: 600;padding:8px 46px;font-size: 14px;color:#887BE4}
.invitesBtn .nav-link>img{margin-right:12px}
.whiteMobile{display: none}
.invitesBtn .nav-link.active>.whiteMobile{display: inline-block}
.invitesBtn .nav-link.active>.blueMobile{display:none}
.invitesBtn .nav-item.show .nav-link, .invitesBtn .nav-link.active{background:#4A628A;color:#fff}
/* .invitesBtn .nav-link.active::after{content:'';position: absolute;bottom: -16px;left: 0;right: 0;margin: auto;width: 0;height: 0;border-style: solid;border-width: 17px 8.5px 0 8.5px;border-color: #4a628a transparent transparent transparent} */
/* Invitation Modal End */



.netMdl .acP{margin-top:22px}
.netMdl .cstmField>label{font-size: 14px;color: rgba(150, 156, 186, 0.94)}
.netMdl .cstmField>label>img{margin-right:5px}
.netMdl .cstmField>p{color:#192434;font-weight:600}
.netMdl .btn-primary{margin-top:5px;background: #E5E5FF;border-radius: 4px;color: #887BE4;padding:7px 8px;font-weight: 600;font-size: 12px;border: 0}
.netMdl .btn-primary>img{margin-right:6px}
.pzaSec{padding:8px 14px}
.operaotrSlider{background: #FFFFFF;box-shadow: 3px 1px 12px 1px rgb(0 0 0 / 7%);border-radius: 12px}
.cl-div>img{width:100%}
.operaotrSlider .slick-prev, .operaotrSlider .slick-next{z-index:1;background: #E5E5FF;border-radius: 4px;width:22px;height:22px}
.operaotrSlider .slick-next {right: -10px !important;bottom: 50% !important}
.operaotrSlider .slick-prev {left: -10px !important;bottom: 50% !important}
.slick-prev:before, .slick-next:before{top: 4px !important;left: 7px !important}
.delP{font-weight: 600;margin-bottom:2px;font-size: 14px;color: #333}
.opnP{font-size: 12px;color: #333}
.datetime{text-align:right}
.datetime>li{margin-right:15px;color: #948F9D;font-size:10px;font-weight:600;display: inline-block;text-align: left}
.datetime>li:last-child{margin-right:0}
.datetime>li>span{font-weight: 700;display: block;font-size: 12px;color:#333}
.datetime>li>img{margin-right:6px;display: inline-block}
/**********************
Operator Dashboard End
************************/

/**********************
Tracking Dashboard
************************/
.trackingTbl{margin: 38px 0 0}
.trackingTbl tr{background: #FFF;box-shadow: 2px 2px 16px -4px rgba(103, 103, 103, 0.15);border-radius: 4px; padding:20px;margin-bottom:20px;display: inline-block;width: 100%}
.trackingTbl tr:last-child{margin-bottom:0}
.trackingTbl tr td{border: 0;display: inline-block;padding: 0;vertical-align: middle}
.trackingTbl tr td:first-child{width: 12%}
.trackingTbl tr td:nth-child(2){width: 20%}
.trackingTbl tr td:nth-child(3){width: 24%}
.trackingTbl tr td:nth-child(4){width: 19%}
.trackingTbl tr td:nth-child(5){width: 17%}
.trackingTbl tr td:nth-child(6){width: 5%}
.linkImg img{width:87px;height: 70px; border-radius:12px}
.linkName span, .YinName span, .daysName span{display: block}
.linkName{font-size:20px;font-weight: 700;color:#000}
.linkName span{font-size:12px;font-weight: 400;color:#8F08FA}
.YinName{font-size:16px;font-weight: 600;color:#000}
.YinName span{font-size:12px;color:#948F9D}
.daysName{font-size:16px;font-weight: 600;color:#000}
.daysName span{font-size:12px;color:#948F9D}
.trckStatus{font-size: 10px;padding:5px 7px;font-weight:700; text-transform: uppercase; display: inline-block;background: #ccc;border-radius: 4px}
.redBgrnd{background: rgba(255, 91, 91, 0.18) !important;color:#FF1856 !important}
.greenBgtr{background: rgba(101, 228, 176, 0.18);color:#00D37D}
/* Create link Modal */
.createMdl .modal-dialog{max-width:594px}
.createMdl .modal-body {padding: 25px}
#createLink .cstmField>label{font-weight: 600}
/**********************
Tracking Dashboard End
************************/

/**********************
Tracking Map Dashboard
************************/
.trckmap{position: absolute;top: 20px;padding:0 20px;z-index: 1;width: 100%}
.trckmapIframe{height:100vh}
.createMdl .countrySec{margin:0}
.trackingLinkDiv .delivery{border-top: 1px solid #E9E9E9;border-bottom:1px solid #E9E9E9;box-shadow:none;padding:15px;margin:15px 0}
.logo-bg-none{display: inline-block;float: none}
.delivery .de-head{font-size:17px;font-weight:600;color:#192434;margin-bottom:20px}
.card-id{position: absolute;bottom: 20px;right: 20px}
.cnt{display: inline-block;margin-left:10px;vertical-align: super;}
.trackingLinkDiv .alarmDiv ul li ol{padding:0}
.cnt>p{font-size:14px;font-weight:600;color:#192434}
.cnt>span{font-size:11px;font-weight:600;color:#9BA7AF}
.direction{margin-bottom: 18px}
.direction>li{display: inline-block;font-size:14px;color:#0894FA;font-weight:600;text-align:center;width:49%}
.direction>li span{display: block;margin-top:7px}
.trackingLinkDiv .timeArrival table tr td{text-align: center;padding-bottom:0;}
.trackingLinkDiv .upArrow{margin: 0;cursor: pointer;}
.trackingLinkDiv .dwnarrow{transform: rotate(-180deg);}
.trackingLinkDiv .timeArrival{left:20px;margin: 0 auto;bottom:20px;z-index:999999;}
.trackingLinkDiv .optDetails span{background: #FFB93426 !important;font-size: 14px;border-radius: 40px;padding: 5px 10px;margin: 5px 0;}
.trackingLinkDiv .time>span{font-size:12px;}
.show-address{border-bottom: 1px solid #E9E9E9;padding: 0 15px 15px;margin:0 0 15px;}
.show-address > p{font-size:14px;color:#948F9D}
.show-address ul{margin-top:15px;}
.show-address ul li{font-size:13px;color:#948F9D;font-weight:600;padding-bottom:20px;position: relative;padding-left:30px;}
.show-address ul li::before{content: '';position: absolute;left: 10px;border-left: 2px dashed #00D37D3D;height: 100%;top: 20%;;}
.show-address ul li:last-child{padding-bottom:0;}
.show-address ul li:last-child::before{display: none;}
.show-address ul li span.circle{position: absolute;left:0;top:4px}
.show-address ul li span{display: block;font-size:16px;color:#333}
.waitingApprover{padding:15px;text-align: center;}
.waitingApproverHead{font-size:18px;color:#192434;font-weight:700;margin-bottom:20px;text-align:left;padding-top:50px;}
.waitingApprover .progress{height:4px;background-color: #F4F4F4;}
.waitingApprover .progress-bar{background-color:#0894FA;}
.emptycar{margin:10px 0 30px;}
.dropoff{color:#948F9D;text-align: left;font-size:14px;}
.adduparrow{float: right;}
.zoomDiv{box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.12);}
.cardMob{display: none;}
/**********************
Tracking Map Dashboard End
************************/


/**********************
Settings Dashboard
************************/
.settingSec{padding:16px 39px 36px 60px}
.settingApp{margin-bottom:25px;background: #FFF;padding:25px;box-shadow: 1.73224px 1.73224px 25px -3.46448px rgba(103, 103, 103, 0.08);border-radius: 10.0154px}
.settingSec>.overHead{margin-bottom:35px;position: relative}
.settingSec .netLogo {position: absolute;right: 0;top:-14px}
.settingApp>p{color: rgba(150, 156, 186, 0.94);font-size:14px;font-weight:600;margin-bottom:29px;text-transform:uppercase}
.reportDiv{text-align: center;background: #FFF;padding:30px 21px;box-shadow: 2px 2px 16px -4px rgba(103, 103, 103, 0.15);border-radius: 5px;max-width: 456px;margin: 0 auto}
.setul li{color: #192434;font-weight: 600;margin-bottom:16px;cursor: pointer;border-bottom: 1px solid #eaeaea;padding-bottom: 16px}
.setul li:hover{color:#887BE4}
.setul li:last-child{margin-bottom:0;border-bottom:0;padding-bottom:0}
.setul li img{float: right;margin-top: 9px}
.cstmBtn, .cstmBtn:hover{background: #887BE4;font-weight: 600;padding: 9px 13px;color: #fff;border-radius: 8px}
.cstmBtn:hover{opacity:0.8}
.reportDiv>h3{font-size:18px;font-weight: 600;color: #192434}
.reportDiv>p{color: rgba(150, 156, 186, 0.94);margin: 10px 0 28px}
textarea{resize: none}
.cstmField textarea.form-control{height: auto}
/**********************
Settings Dashboard End
************************/


/**********************
Notification Dashboard
************************/
.notificationSec{padding: 16px 39px 36px 60px}
.notiDiv{max-width:633px;margin:0 auto;padding:20px;background-color:#fff;box-shadow: 1.73224px 1.73224px 25px -3.46448px rgba(103, 103, 103, 0.08);border-radius: 10px}
.notiHead{margin: 0 0 30px}
.notiHead span{font-size: 14px;float: right;color: #887BE4;margin-left: 0;margin-top: 8px}
.notiHead span img{margin-right:8px}
.notiUl>li{margin: 0 0 12px;padding:6px 15px 6px 6px;background-color:#fff;border-radius: 8px}
.notiUl>li:last-child{margin-bottom:0}
.notiUl>li.active{background:#F3F2FC}
.notiUl>li>p{display: inline-block}
.notiUl>li>p:nth-child(2){width: 62%;padding-left: 19px;vertical-align: middle;color: #777}
.notiUl>li>p>img{width: 60px;height: 53px;border-radius: 4px}
.notiUl>li>p>span{font-weight:600;color: #192434}
.notiUl>li>.time{float: right;color: #948F9D;font-size: 12px;padding:8px 0 0}
.notiUl>li.active .time{color:#8F08FA}
.seeAll{font-size:14px;color:#887BE4;cursor: pointer; text-align: center;padding:30px 30px 10px;font-weight: 600}
.seeAll img{vertical-align: sub}
.notiday{color: rgba(150, 156, 186, 0.94);font-size:14px;font-weight:600}
.mt40{margin-top:40px !important}
/**********************
Notification Dashboard End
************************/

/**********************
My Account Dashboard 
************************/
.myAccountSec{padding:16px 39px 36px 60px}
/* .accntDiv .acP{padding-right: 145px} */
.accntDiv{max-width:593px;position: relative;padding: 20px 37px}
.accntDiv .usrDivBg{text-align: center;margin:-90px 0 50px}


.myAccountSec .usrDivBg>span{width:137px;height:137px;border-radius:4px;display: inline-block;position: relative;border:0}
.myAccountSec .usrDivBg>span>img{width: 100%;border-radius:10px;height:137px}
.myAccountSec .usrDivBg>span i, .myAccountSec .usrDivBg>span button{position: relative;top: -20px}
.myAccountSec .usrDivBg>span button{top:-16px;border: 0;background: none;padding: 0}
.myAccountSec .usrDivBg>P{font-weight:600;color:#000;font-size:22px;display: block}
.myAccountSec .usrDivBg>p span{font-size:12px;color:#9BA7AF;display: block;font-weight: 600;margin-top: 5px}
.accntDiv .countrySec{margin:0}
.brfUl>li{font-weight:600;border:1px solid #C4C8D1;border-radius:4px;padding:10px 45px;display: inline-block;margin-right:30px}
.brfUl>li:last-child{margin-right:0}
.brfUl>li>img{margin-right:10px;vertical-align: sub}
.pl115{padding-left:115px}
.accntDiv .cstmField>label{font-size: 14px;font-weight: 600}
.accntDiv>.editBtn, .accntDiv>.saveBtn{position: absolute;top:22px;right:22px}
.accntDiv .cstmField>p{font-weight:600;color:#192434}
.editBtn, .saveBtn{border: 1px solid #887BE4;color:#887BE4;border-radius:8px;padding:8px 16px;font-size:14px;font-weight:600}
.editBtn>img, .saveBtn>img{margin-right:9px}
.editBtn:hover{opacity: 0.9;color:#887BE4}
.saveBtn{background-color:#887BE4;color:#fff}
.saveBtn:hover{opacity: 0.9;color:#fff}
.chngPw{margin:40px 0 25px;text-transform:uppercase;color: rgba(150, 156, 186, 0.94);font-weight: 600;font-size: 14px}
.glb-btn{margin-top:30px;text-align: center}
.redBgBtn{background:#FF1856;color: #fff}
.redBgBtn>img{margin-right:8px}
/**********************
My Account Dashboard End
************************/


/**********************
Message Dashboard
************************/
.form-control:focus{border-color:#ced4da;box-shadow: none}
.msgHt{height:100vh}
.messageSec{height:100%;padding:16px 39px 36px 60px}
.messageSec>.row{height: 100%}
/* .onlineBg{background:#F0F0F0;padding:0} */
.chatBg{background:#fff;box-shadow: 1.73224px 1.73224px 25px -3.46448px rgb(103 103 103 / 8%);border-radius: 10.0154px}
/* .messgeDiv{padding: 40px 30px} */
/* .onlineBg>.messgeDiv{background-color: #fff} */
.notiHead > i, .ntrad{width:23px;height:23px;background:#887BE4;font-size:12px;color:#fff;font-style: inherit;display: inline-block;border-radius:4px;text-align: center;line-height: 23px;margin-left:5px;vertical-align: middle}
.messgeDiv > .notiHead{border-color:#C4C8D1;color:#192434;font-size:22px;margin: 0 0 15px;border: 0;padding: 20px 25px;background: #fff;box-shadow: 1.73224px 1.73224px 25px -3.46448px rgb(103 103 103 / 8%);border-radius: 10.0154px}
.onlineUl{margin-top:16px}
.onlineUl>li{display: inline-block;margin-right:13px;position: relative}
.onlineUl>li:last-child{margin-right:0}
.onlineUl>li img{width:50px;height:47px;border-radius:5px}
.online{width:8px;height:8px;border-radius:50%;background:#00D37D;border:1px solid #fff;display: inline-block}
.onlineUl li span{position: absolute;bottom:-1px;right:-2px;margin: 0}
.searchDiv{position: relative;padding-bottom: 10px}
.searchDiv input{padding-left:42px;border-radius: 10px;font-size: 12px;height: 43px;border-color: #eaeaea}
.searchDiv img{position: absolute;left:12px;top: 9px}
.messageSec .chatHis .notiUl>li>p{position: relative}
.messageSec .chatHis .notiUl>li>p:first-child span{width:13px;height:13px;position: absolute;right: -3px;bottom: -3px}
.messageSec .notiUl>li>p>span{font-size:16px;display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;width: 100%}
.messageSec .notiUl>li>p:nth-child(2){font-size: 12px;color:#948F9D;width:56%}
.messageSec .notiUl>li>.time{padding:0;color:#746F7E;font-weight: 600}
.messageSec .notiUl>li>p>img{width: 50px;height:50px}
.chatHis .notiHead{padding: 0px 30px 30px;border: 0;color:#192434;padding: 0px 0 18px;margin: 0}
.chatting{padding:20px 25px}
.chatting .usrDivBg{padding: 0 0 20px;border-bottom: 1px solid #eaeaea;margin-bottom: 20px}
.addBtn, .addBtn:hover{float: right;border: 2px solid #887BE4;color: #887BE4;font-weight: 600;padding: 8px 18px}
.addBtn:hover{opacity:0.8}
.chatting .usrDivBg>span{position: relative}
.chatting .online{position: absolute;bottom: -2px;right: -3px}
.chatbottomArea {position: relative}
.chatbottomArea textarea{height: 99px;background: #FFFFFF;border: 1px solid #CBCBCB;border-radius: 5px}
.chatBtn {position: absolute;text-align: right;right: 9px;top:36px}
.chatBtn span img{margin-right:15px;cursor: pointer}
.enter{font-size:12px;color:#4A628A;margin-top:12px;cursor: pointer}
.enter>img{margin-right:5px}
.chatBtn .cstmBtn{padding:5px 9px;border-radius: 8px}
.messageSec .chatbottomArea textarea{height: 78px;border: 0;padding-right: 210px;font-size: 14px;color: #9BA7AF;border-top: 1px solid #eaeaea;border-radius: 0}

.chatMd{width: 100%;bottom: 43px}
.messageSec .chatMd>div{margin-bottom:40px}
.chatMd>div:last-child{margin-bottom:0}
.msgDiv{background: #887BE4;max-width: 387px;color:#fff;padding:10px;border-radius: 15px 15px 0px 15px}
.messageSec .your .msgDiv{background: #F4F4F4;color:#192434;border-radius:15px 15px 15px 0px}
.messageSec .your{position: relative}
.messageSec .msgTime{color: #948F9D;font-size: 12px;margin-top:3px;position: absolute;right: -53px;bottom: 0}
.chatHis{padding: 20px 25px;background: #fff;box-shadow: 1.73224px 1.73224px 25px -3.46448px rgb(103 103 103 / 8%);border-radius: 10.0154px}
.ntrad{border-radius:50%;position: absolute;right: 0;bottom: 20px;margin: 0}
.chatHis .notiUl {height: calc(100vh - 324px);overflow: auto;width: 100%}
.chatHis .notiUl>li {margin:2px 0 0;padding: 20px 0px;position: relative;cursor:pointer;border-bottom: 1px solid #eaeaea}
.messageSec .notiUl>li:hover>p:nth-child(2){color:#5A5564}
.chatHis .notiUl>li.active{background: #F3F2FC;border-radius:10px;padding: 20px 10px}
.chatHis .notiUl>li.active .ntrad{right: 10px}
.messageSec .against {margin-right: 10px;position: relative}
.messageSec .against .msgTime{right: inherit;left: -62px}
.dotsBtn, .dotsBtn:hover{border:0;padding: 0;background-color: inherit}
.messageSec .chatMiddleArea{padding-bottom:43px;position: relative;height:calc(100vh - 238px);overflow: auto}
.exl{background-color:#EBEAEA;border-radius:8px;padding:10px;margin-top:4px}
.exl>span{margin: 0 10px;width: 180px;display: inline-block;overflow: hidden;vertical-align: middle}
/**********************
Message Dashboard End
************************/

/**********************
Alarm Dashboard Start
************************/
.mt30{margin-top:30px}
.alarmSpan{cursor: pointer}
.alarmDiv{box-shadow: 2px 2px 16px -4px rgba(103, 103, 103, 0.15);background-color:#fff;border-radius: 8px;padding:20px 15px;margin-bottom:18px}
.alarmDiv>h4{font-size:20px;font-weight:700;margin-bottom:5px}
.alarmDiv>p{font-size:15px;font-weight:600;color:#948F9D;margin-bottom:30px}
.alarmDiv ul li{display: inline-block;margin-right:8px;font-weight: 600;cursor: pointer}
.alarmDiv ul li img{vertical-align: sub;margin-right:0}
.alarmDiv ul li:last-child{margin-right:0;float: right}
.alarmDiv ul li.edit{color:#887BE4}
.alarmDiv ul li.delete{color:#FF1856}
.switch {position: relative;float: right;width:44px;height:22px;margin:2px 0 0}
.switch input { opacity: 0;width: 0;height: 0}
.slider {position: absolute;cursor: pointer;top: 0;left: 0;right: 0;bottom: 0;border: 1px solid #C4C8D1;background-color: #9BA7AF;-webkit-transition: .4s;transition: .4s}
.slider:before {position: absolute;content: "";height: 18px;width: 18px;left: 2px;bottom: 1px;background-color: #fff;-webkit-transition: .4s;transition: .4s}
input:checked + .slider {background-color: #887BE4}
input:checked + .slider:before {background:#fff;-webkit-transform: translateX(21px);-ms-transform: translateX(21px);transform: translateX(21px);border: 2px solid #f4f4f4}
/* Rounded sliders */
.slider.round {border-radius: 34px}
.slider.round:before {border-radius: 50%}

.alertMdl{text-align: center}
.alertMdl .close{top:10px}
.alertMdl .modal-body {padding: 30px 60px}
.alertMdl .modal-dialog {max-width: 600px}
.alertMsg>img{width:100px;margin-bottom:34px}
.alertMsg>h3{font-size:25px;font-weight:700;margin-bottom:10px;color:#000}
.alertMsg>p{font-size:16px;font-weight:400;color:#4A628A}
.btn-secondary{font-weight: 600;border:2px solid #C4C8D1;background: #F4F4F4;padding: 8px 18px;color: #948F9D;border-radius: 8px}
.alertMdl .alarmBtn .btn-secondary{color: #948F9D}
.btn-secondary:hover{color:#fff !important}
.alarmBtn .btn{margin-right:15px}
.alarmBtn .btn:last-child{margin-right:0}

.sucMdl .modal-dialog {max-width: 500px}
.sucMdl .modal-body {padding: 70px 60px}
.sucMdl .alertMsg>img {width: 70px}

.alarmaSec .operatorSearch{margin-bottom:26px;margin-top: 30px}
.alarmaSec .usrDivBg>span{width: 42px;height: 42px;background: rgba(255, 24, 86, 0.15);border-radius: 8px;border: 0;text-align: center;line-height: 40px}
.alarmaSec .usrDivBg>span>img{width: initial}
.alarmaSec .usrDivBg>P{font-weight: 600;margin-left: 15px;overflow: hidden;width:60%;white-space: nowrap;text-overflow: ellipsis}
.alarmaSec .groupDots .dropdown-menu {min-width: 90px}
.alarmaSec .groupmenudd a{color: #192434}
.alarmaSec .usrDivBg>p span {color: #9BA7AF;font-weight: 600;margin-top: 0}
.alarmaSec .usrDivBg>p span>img{margin-right:6px}
.alarmaSec .alarmDiv .alarmContent{margin:17px 0 0;color:#9BA7AF;font-size:14px;font-weight:400}
.alarmBtm {border-top: 1px solid #E5E6EA;margin: 19px 0 0;padding-top: 18px}
.alarmBtm>ul>li>span{display: inline-block;width: 80px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;margin-left: 5px;vertical-align: sub}
.amberBGA{background-color: #FFF0E2 !important}
.alarmaSec .notiDiv{max-width: initial}
.alarmaSec .notiDiv .notiHead {margin: 0 0 20px;font-size: 16px}
.alarmaSec .notiUl>li>p{position: relative}
.not {position: absolute;bottom: -5px;right: -5px}
.alarmaSec .notiUl>li>.time{color: #887BE4}
.mb25{margin-bottom:25px !important}
.alarmMdl .timeTaken select{padding: 5px;position: absolute;width: 92px;background: #4A628A;color: #fff;height: 34px;margin: 2px}
.alarmMdl .timeTaken input{padding-left: 102px}
.mapMd{margin-top:6px}
.mapMd>img{width:100%}
.calendar{position: relative}
.calendar>input.form-control{padding-left: 30px}
.calendar>img{position: absolute;bottom: 9px;left: 4px}
/**********************
Alarm Dashboard End
************************/


/***************************
Time Display
***************************/
.breadcrumb li, .breadcrumb li a{color:#948F9D;font-size:12px;font-weight:600}
.breadcrumb li{color:#746F7E}
.display{margin-top:3px;padding:20px;background: #fff;width: fit-content;box-shadow: 2px 2px 16px -4px rgba(103, 103, 103, 0.15);border-radius: 10px}
.disHead{color:#9BA7AF;font-size:14px;font-weight:600;margin-bottom:15px;text-transform: uppercase}
.disUl > li{border: 1px solid #E9E9E9;padding:16px 15px;min-width:227px;margin-right:10px;border-radius:5px;display: inline-block}
.disUl > li:last-child{margin-bottom:0}
.disUl>li>input{display: inline-block;width:18px;height:18px}
.disCnt{display: inline-block;margin-left: 22px;vertical-align: middle}
.disCnt h5{font-size:16px;font-weight:600;color:#192434;margin-bottom:7px}
.disCnt p{font-size:12px;font-weight:600;color:rgba(150, 156, 186, 0.94)}
.settingSec>.disOv{margin-bottom:6px}
.disOv>img{cursor: pointer}

.slider-handle{margin-top:-12px}
.slider.slider-horizontal{border:0}
.slider-horizontal:before{display: none}
.slider.slider-horizontal{height: inherit}

/* New Add Css */
.optDetails {width: 60%;display: inline-block}
.optUl{display: none}
.optDetails h3 {width: 66%;overflow: hidden;white-space: nowrap;text-overflow: ellipsis}
.optList>.row>.col-md-4{margin-bottom:17px}
.pagination{margin-top:30px}
.mobSlideDiv {height: 100%;overflow: hidden}
.mobToggle{float: right;display: none;margin-top: 19px;border: 1px solid #777;border-radius: 4px}
.mobToggle>span {display: block;width: 30px;height: 1px;background: #777;margin: 6px}
.optDetails h3{width:100%}
.mobBack{display:none}



/******************* User Management ***************************/
.amberBgrnd{background: rgba(242, 153, 74, 0.18) !important;color: #FFB934 !important}
.userMngTbl{margin: 20px 0 0}
.userMngTbl tr{width:48.9%;padding: 10px;margin-right: 22px;float: left}
.userMngTbl tr:nth-child(even){margin-right:0}
.userMngTbl .optTop .optImg{width: auto;height: auto}
.userMngTbl .optTop .optImg img{width:64px;height: 60px}
.userMngTbl tr td:first-child{width:48%}
.userMngTbl tr td:nth-child(2){width:29%}
.userMngTbl tr td:nth-child(3){width:11%}
.userMngTbl tr td:nth-child(4){width:8%;text-align: right}
.userMngTbl .optP{font-size: 16px;color: #746F7E}
#addUser .modal-dialog{max-width: 520px}
.userDiv{position: relative}
.userSec .optImg{float: none;vertical-align: middle;display: inline-block}
.userSec .optDetails h3{margin:0}
.userSec .optDetails{vertical-align: middle}

/* New css 13-Sep-21*/
.groupIcn{font-size: 14px;margin-top: 9px;color: #887BE4;float: right}
.groupIcn>img{margin-right: 5px;margin-top: -2px}
.groupMdl .modal-body{padding: 25px 30px !important}
.groupMdl .modal-title{font-size: 24px;font-weight: 600;color: #192434}
.groupFrom{margin-top:36px}
.groupFrom .upload{width: 20%;display: inline-block;margin: 0 10px 0 0}
.groupFrom .cstmField {vertical-align: top;width: 76%;display: inline-block}
.groupFrom .loginBtnMdl{width: 49%;margin-bottom: 15px;display: inline-block;border-radius:8px}
.groupFrom .upload>img{border-radius:6px}
.outlineBtn{background: none;color: #887BE4}
#addmember .groupFrom{margin:0}
#addmember .modal-title span, .ttuser span{background: #4A628A;padding: 3px 8px;color: #fff;font-size: 12px;border-radius: 20px;vertical-align: middle}
.searcField{position: relative;margin: 20px 0 30px}
.searcField>img{position: absolute;top: 12px;left: 10px}
.searcField input{height: 47px;padding: 5px 95px 5px 40px}
.searcField .loginBtnMdl{margin: 0;position: absolute;top: 0;right: 0;width: 89px;height: 47px}
.memberList {max-height: 350px;overflow: auto}
.memberList>li{margin-bottom:22px;cursor: pointer}
.memberList>li.current .optImg{position: relative}
/* .memberList>li .optImg img{border: 2px solid transparent} */
.memberList>li.current .optImg img{border-color:#887BE4}
.memberList>li.current .optImg:after{background: url(../images/checked.png) no-repeat;width: 20px;height: 20px; position: absolute; content: '';bottom: 0;right: -10px}
.memberList>li:last-child{margin-bottom:0}
.memberList .optP{font-size: 16px;color: #746F7E}
.memberList .optTop .optImg img{width: 64px;height: 60px;border-radius: 4px}
.groupDots{float: right}
.dotsLink{float: right;width: 37px;height: 37px;text-align: center;border-radius: 50%;line-height: 33px}
.dotsLink.active{background: #D9EFFF}
.dotsLink.active .dotsGray, .dotsBlue{display: none}
.dotsLink.active .dotsBlue{display: inline-block}
.groupDots .dropdown-menu{min-width: 170px;box-shadow: rgb(160 160 160 / 25%) 0px 0px 4px;border: 0px}
.groupmenudd a{display: block;font-size: 12px;color: #887BE4;padding: 5px 22px}
.groupmenudd a img{margin-right: 11px}
.deletegroup{color: #FF1856 !important}
#manageGroup .optDetails{width: 47%;vertical-align: middle;display: inline-block}
.deleteUser{cursor: pointer;color: #FF1856;width: 31%;display: inline-block;text-align: right}
.AdministratorUser{color:#887BE4}
.userList{border-top: 1px solid #EAEAEA;margin: 25px 0 37px} 
#manageGroup .groupFrom {margin-top: 30px}
.ttuser{margin: 20px 0 24px;font-size: 20px;color: #4A628A}
.ttuser img{margin-right: 11px;vertical-align: middle}
.ttuser span{float: right}
.deleteUser img{vertical-align: sub}
#manageGroup .optTop .optImg{position: relative}
.dots{width:9px;height: 9px;background:#ccc;border-radius:50%;border:2px solid #fff;position: absolute;bottom:-6px;right:-2px}
.amberColor{background: #FFB934 !important}
.greenColor{background: #00D37D !important}
.bottomLink li{border-top: 1px solid #eaeaea}
.bottomLink li a{color: #4A628A;padding: 16px 0px;display: block;font-size:16px}
.bottomLink li a img{margin-right:5px}
.bottomLink .removeGroup a{color:#FF1856}
.bottomLink li:last-child a{padding-bottom:0}

/********************* New Idispatch **********************/
.messageSec .optImg, .groupMdl .optImg{border-radius: 4px;width:64px;height:60px;float: left}
.groupMdl .optImg{position: relative}

.container{max-width:1281px}
.topBg{background: url(../images/landing/topBG.png) no-repeat 0 0 / cover;min-height:1180px}
.beyUl{margin-bottom:38px}
.beyUl>li{display: inline-block;margin-right: 70px;color: #192434}
.beyUl>li:last-child{margin-right:0}
.beyUl>li>.imgTick{background: rgba(149, 205, 65, 0.15);display: inline-block;text-align: center;line-height: 42px;margin-right: 18px;border-radius: 9px;width:43px;height:43px}
.pb104{padding-bottom:104px}
.slick-prev, .slick-next{top: inherit;bottom: 56px}
.slick-next{right: 60px;transform: rotate(180deg);bottom: 53px}
.slick-prev {left:78%}
.slick-prev:before, .slick-next:before{position: absolute;background: url(../images/landing/arrow.png) no-repeat 0 0 / cover; width:8px;height:14px; content:""}
.noPadding{padding:0}
.navbar-light .navbar-toggler-icon{background: url(../images/landing/menu.png) no-repeat 0 0 / cover;width: 48px;height: 38px}
.freePlan, .proPlan{display: none;margin-left: -37px; margin-top: 8px;font-size: 16px;font-weight: 600;color: #192434}
.freePlan>img, .proPlan>img{margin-right: 12px}
.mobileButton{display:none !important}

/* Invite Link */
.inviteMdl .groupFrom .cstmField{width:100%;position: relative}
.dotsDd{position: absolute; right: 0;bottom: 7px}
.inviteMdl .groupFrom .loginBtnMdl>img{margin-right:8px}
.groupFrom .outlineBtn:hover{background-color: inherit;color:#887BE4;opacity:0.8}
.checkmmb{float: left;margin:18px 18px 0 0 }

/* */
.emptyChat{color: #192434;padding-top: 310px;text-align: center}
.emptyChat>img{margin-bottom:12px}
.createGrp{font-size: 14px;color: #887BE4;font-weight: 600;border-bottom: 1px solid #eaeaea;padding: 30px 0 15px;margin-bottom: 18px}
.createGrp>img{margin-right: 8px;vertical-align: sub}
.addmore{margin: 15px 0 26px}
.addmore>button{font-size: 14px;color: #887BE4;background: inherit;border: 0;padding: 0}
#newChat .loginBtnMdl{margin: 20px 0 0;width: auto;border-radius: 8px}


/* SignUp */
.noMargin{margin:0 !important}
.noPadding{padding:0 !important}
.leftBG{background: url(../images/signup/leftBg.png) 0 0 / cover;min-height: 100%;position: fixed;width: 33%}
.back, .back:hover{color:#fff;margin:30px 0 0 30px;display: inline-block}
.back:hover{opacity:0.9}
.createAccnt>h2{font-size: 22px;color:#192434;font-weight:600;margin:0 0 2px}
.createAccnt>p{font-size:14px;color:#5A5564}
.accnt{position: absolute;left: 0;text-align: center;right: 0;bottom: 30px}
.accnt>img{margin-bottom: 256px}
.accnt>p{color: #fff;opacity: 0.6;font-size: 16px;margin-bottom: 20px}
.accnt>button{font-size: 14px;color: #fff;border: 1px solid #fff;border-radius: 8px;padding: 8px 30px}
.accnt>button:hover{background-color:#fff}
.createAccnt{padding:76px 92px 66px}
.form{border: 1px solid #EAEAEA;padding:24px 30px;margin:22px 0;border-radius: 8px}
.form ::-webkit-input-placeholder{ /* Chrome/Opera/Safari */color: #EAEAEA}
.form ::-moz-placeholder{ /* Firefox 19+ */color: #EAEAEA}
.form :-ms-input-placeholder{ /* IE 10+ */color: #EAEAEA}
.form :-moz-placeholder{ /* Firefox 18- */color: #EAEAEA}
.question{position: fixed; bottom:20px; right: 20px}
.signIn{padding-top:247px}

/* Help */
.helpBg{background: url(../images/help/topBg.png) no-repeat 0 0 / cover;min-height:370px}
.helpLogo{margin-left:28px}
.helpSearch {text-align: center;margin-top: 60px;color: #fff}
.helpSearch>h2{font-size: 40px;font-weight: 600}
.helpSearch>.search{margin:20px 0 30px}
.helpSearch .srchSec input{background: #fff;width: 490px;padding-left: 20px;padding-right: 109px}
.helpSearch .srchSec>.btn{margin-left: -100px;padding: 7px 19px;margin-top: 4px}
.recentSearch>li{display: inline-block;color:#fff;font-weight:600;font-size:14px;margin-right:20px}
.recentSearch>li:last-child{margin-right:0}
.recentSearch>li>a{font-weight:400;text-decoration:underline;color:#fff}
.helpCategory{margin-top: 48px}
.helpDiv{box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.06);padding:28px;text-align: center;border-radius: 13px;margin-bottom:30px}
.helpDiv>p{font-weight: 600;font-size: 18px;color:#333;margin-top:12px}
.mb30{margin-bottom: 30px !important}

/******* Task *********/
.taskTbl tr {cursor: pointer}
.hiddenRow {padding: 0 !important;background-color:#F3F2FC;border-radius: 5px;width:100% !important}
.oprcall>li{display: inline-block;margin-right:6px}
.oprcall>li:last-child{margin-right:0}
.taskTbl{margin:0}
.taskTbl td, .taskTbl th{font-size:14px;float: left}
.taskTbl .empname>img{margin-right:5px;vertical-align: top;width:28px;height:26px}
.taskTbl .empname>span{display: inline-block;font-size: 12px}
.taskTbl .empname>span>i{display: block;font-style: normal;color:#C4C8D1;font-size: 8px;font-weight:400}
.taskTbl .empcall>img {margin-right: 0;vertical-align: middle}
.taskTbl .saveBtn{font-size:10px;padding: 6px 16px;margin-right:6px}
.taskTbl .optDetails{width:100%}
.taskTbl tbody tr td:first-child{position: relative}
.taskTbl tbody tr td:first-child::before{background:url(../images/dashboard/tasks/arrowDown.png) no-repeat;content:'';position: absolute;left:-20px;top:20px;width: 14px;height:9px;transition:all 0.5s ease-in-out}
.taskTbl tbody tr td.hiddenRow:first-child::before, .hiddenRow tr td:first-child::before{display: none}
.taskTbl thead tr th:first-child, .taskTbl tbody tr td:first-child{width:14%}
.taskTbl thead tr th:nth-child(2), .taskTbl tbody tr td:nth-child(2){width:13%}
.taskTbl thead tr th:nth-child(3), .taskTbl tbody tr td:nth-child(3){width:10%}
.taskTbl thead tr th:nth-child(4), .taskTbl tbody tr td:nth-child(4){width:8%}
.taskTbl thead tr th:nth-child(5), .taskTbl tbody tr td:nth-child(5){width:10%;text-align: center}
.taskTbl thead tr th:nth-child(6), .taskTbl tbody tr td:nth-child(6){width:8%}
.taskTbl thead tr th:nth-child(7), .taskTbl tbody tr td:nth-child(7){width:7%}
.taskTbl thead tr th:nth-child(8), .taskTbl tbody tr td:nth-child(8){width:12%}
.taskTbl thead tr th:nth-child(9), .taskTbl tbody tr td:nth-child(9){width:7%}
.taskTbl thead tr th:nth-child(10), .taskTbl tbody tr td:nth-child(10){width:9%}
.taskTbl thead tr th:last-child, .taskTbl tbody tr td:last-child{width:2%}
.redColor{color:#FF1856}
.taskTbl tr[aria-expanded="true"]{background-color:#F3F2FC}
.taskTbl tr[aria-expanded="true"] td:first-child::before{transform:rotate(180deg)}
.createMdl .modal-dialog{max-width:1290px}
.createMdl .alarmHead{margin-bottom:20px}
.uploadText{color:#887BE4;font-size:14px;font-weight:600;margin-top: 5px;display: inline-block}
.uploadText>img{margin-right:5px;vertical-align: middle}
.trackinCnt{font-size:14px}
.createMdl .form{padding:22px 20px;margin:28px 0 0}
.createMdl .editBtn{min-width:120px}
.createMdl .alarmBtn{text-align: right}
.plan{background-color:#F4F5F6;border: 1px solid #EAEAEA;padding:20px;height: 579px;overflow-y: auto;border-radius: 8px;margin:28px 0 0}
.plan>p{font-weight: 600;color:#000;font-size: 15px}
.empty{text-align: center;padding-top: 190px}
.empty>p{color:#948F9D;font-weight: 400;margin-top:12px;font-size: 14px}
.planUl{margin:20px -20px 0}
.planUl>li{background-color: #EAEAEA;padding: 19px 15px;margin-bottom:15px}
.planUl>li:last-child{margin-bottom:0}
.plnName {font-weight: 600;font-size: 14px;color: #192434;margin: 18px 0 8px}
.plnDate {font-weight: 400;font-size: 12px;color: #192434}
.plnDate>span{position: relative}
.plndots{width:2px;height:2px;background-color: #192434;border-radius:50%;display: inline-block;vertical-align: middle;margin:0 6px}
.deletetask {font-weight: 600;font-size: 14px;text-align: right;color: #9BA7AF;cursor: pointer;margin-top:-23px}
.plnEdit>img, .deletetask>img{margin-right: 10px;vertical-align: middle;cursor: pointer}
.deletetask>img{vertical-align:sub}
.plnEdit>button{padding: 3px 11px;float: right;font-size:10px;font-weight:600}
.plnEdit>button>img{margin-right:4px}
.plnEdit>span{color:#746F7E;font-size:12px;font-weight:600}
.createMdl .form ::-webkit-input-placeholder{ /* Chrome/Opera/Safari */color: #746F7E}
.createMdl .form ::-moz-placeholder{ /* Firefox 19+ */color: #746F7E}
.createMdl .form :-ms-input-placeholder{ /* IE 10+ */color: #746F7E}
.createMdl .form :-moz-placeholder{ /* Firefox 18- */color: #746F7E}
.createMdl .calendar>img{left:6px;bottom:12px}
.deliveryMdl {margin-top: 24px}
.deliveryMdl .empname{min-width:130px}
.deliveryMdl .modal-dialog {max-width:1304px}
.deliveryMdl .modal-body > .row{max-width: 1110px}
.assignTbl tr td{border:0;padding:16px 5px;font-weight:600;font-size:14px}
.assignTbl tr td:first-child{font-weight: 400;color: #9BA7AF;font-size: 14px}
.clndIcn{vertical-align: sub;margin-right:8px}
.deliveryMdl .alarmHead{text-align:right}
.deliveryMdl .alarmHead>button{padding:4px 11px}
.deliverySec .netLogo{position:static;margin-right:0}
.deliveryMdl .empname>img{margin-right:9px;width: 24px;height: 23px}
.clientLocationSec .empname>img{margin-right:2px;width: 29px;height: 28px}
.clientLocationSec .empname>span>i{line-height:1px}
.clientLocationSec>img{height:392px}
.thumbAction{display: inline-block;vertical-align: top}
.thumbAction>i{color: #9BA7AF;display: block;font-weight: 600;font-size: 11px;font-style: inherit}
.thumbImg .thumbAction>img{margin-right:10px;vertical-align: inherit}
.deliveryMdl .thumbImg>img{margin-right:2px;width: 83px;height:61px}
.assignTbl tr td .csTnotes{font-weight:400}
.clientLoc{display: inline-block;margin-left: 18px;vertical-align: top}
.clientShare{float: right;position: absolute;right:30px}
.clientMap{border-radius:10px;width:100%;margin-top:12px}
.mt30{margin-top:30px !important}
.decpad{padding:4px 11px !important;font-size:10px !important}
.subTaskTbl{background: #F4F4F4;padding: 18px;margin: 0;display: block;border-radius:8px}
.subTaskTbl tr td{padding:8px 15px}
.clientComments{border-top: 1px solid #E2E2E2;padding-top: 15px}
.clientComments>p{font-weight: 600;color: #9BA7AF;margin-bottom: 12px;text-transform: uppercase;font-size: 12px}
.clientComments .notiUl>li>p{vertical-align: top}
.clientComments .notiUl>li>p>img {width: 25px;height: 24px}
.clientComments .notiUl>li>p>span{display: block}
.clientComments .notiUl>li>.time {color: #C4C8D1;font-weight: 600}
.clientComments .notiUl>li>p:nth-child(2){font-size: 12px}
.listTbl{margin:0 0 20px;padding:0 0 20px;border-bottom:1px solid #EAEAEA}
.listTbl:last-child{border:0;margin:0;padding:0}
.listTbl>table{margin:0}
.close{opacity:1}
.addCstmer{background: #F4F5F6;margin: 4px -20px 0;padding: 8px 20px 17px;position: relative}
.closeIcn{position: absolute;right:10px;top:5px;z-index: 1}
.closeIcn>img{width:12px}
.useerDtl{margin:35px 0 6px}
.usseeImg{width:20px;margin-right: 10px}
.useerCnt{font-size:12px;color:#192434}
.useerCnt>span{margin-left:14px}
.useerCnt>.email{margin: 0;max-width: 40%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;display: inline-block;vertical-align: middle}
.usseINfo{cursor: pointer}
.useerDtl>span{font-size: 12px;font-weight: 600;color:#192434}
.upldedCnt{margin:16px 0}
.upldedCnt>img{margin-left:-3px}
.upldedCnt>span{font-size:10px;font-weight:600}
.upldedCnt>a{float: right;margin-top:-1px}
.cancel{color:#FF1856 !important}
.grayBg{background:#fbfbfb}
.netevBn .nav-link{margin-right:2px}
.taskDots{padding-top:4px}
.cstmField select.form-control{appearance:none;background:#fff url(../images/arrow.svg) no-repeat;background-position: calc(100% - 10px)}
.mt10{margin-top:10px !important}
.delPlan{background: #F4F5F6;border: 1px solid #EAEAEA;border-radius: 8px;padding:10px;height:404px;overflow:auto}
.delPlanInner{background: #EAEAEA;padding:15px;border-radius: 8px;margin-bottom:12px}
.delPlanInner:last-child{margin-bottom:0}
.mt30{margin-top:30px !important}

/*Task Modal 9-dec-22 Start */
.tsPlan{display: flex;align-items: center;justify-content: space-between}
.tsPlan>p{font-weight: 600;color: #000;font-size: 15px}
.tsPlan>button{font-weight: 600;font-size: 14px;color: #887BE4}
.tsPlan>button>img{margin-right: 8px}
.planUl{margin: 20px 0 0}
.planUl .panel{margin-bottom:8px;background: #EAEAEA;border-radius: 8px;padding: 12px 16px}
.planUl .panel:last-child{margin-bottom:0}
.planUl .panel-heading .accordion-toggle:after {content: "";width: 24px;height: 24px;float: right; background: url(../images/dashboard/tasks/acrdArrow.svg) no-repeat}
.planUl .panel-heading>.accordion-toggle{display: flex;align-items: center}
.count{font-weight: 600;font-size: 12px;color: #746F7E;align-items: center;vertical-align: middle;display: inline-flex;flex: 1;margin-left: 10px}
.count>i{width: 13px;height: 13px;background: #FFB934;font-style: inherit;display: inline-flex;border-radius: 50%;font-weight: 600;font-size: 10px;color: #fff;align-items: center;justify-content: center;margin-right: 3px}
.count.tsGreenBg>i{background: #00D37D !important}
.planAction{float: right;margin-right: 5px}
.planUl .panel-body>div{border-bottom: 1px solid #D6D4DA;padding-bottom: 22px;margin-bottom: 12px}
.planUl .panel-body>div:last-child{padding-bottom:0;margin-bottom:0;border-bottom:0}
.tsLocation{display: flex;margin:14px 0;align-items: center}
.tsLocation>li{font-weight: 400;font-size: 14px;color: #192434;margin-right: 29px}
.tsLocation>li:last-child{margin-right:0}
.tsLocation>li>img {margin-right: 2px}
.tsTime{display: flex;align-items: center}
.tsTime>li{background: rgba(155, 167, 175, 0.18);border-radius: 6px;font-weight: 600;font-size: 12px;color: #4A628A;padding: 3px 9px;margin-right: 6px}
.tsTime>li:last-child{margin-right:0}
.tsBenSec {display: flex;align-items: center;justify-content: space-between}
.tsBenHead>h4{font-weight: 600;font-size: 16px;color: #192434}
.tsBenHead>span{font-weight: 600;font-size: 10px;color: #746F7E}
.tsBenDetail{text-align: right}
.tsBenDetail>a{font-weight: 400;font-size: 12px;color: #192434;display: flex}
.tsBenDetail>span{font-weight: 400;font-size: 12px;color: #192434}
.tsUrlSec {display: flex;align-items: center;justify-content: space-between}
.tsUrl{font-weight: 400;font-size: 12px;color: #192434}
.tsUrl>img{margin-right: 7px}
.tsShare{cursor: pointer}
.tsNoteDetail{font-weight: 400;margin-bottom: 3px;font-size: 12px;color: #192434}
.tsNote{font-weight: 600;font-size: 10px;color: #746F7E}
.tsOperator{font-weight: 600;font-size: 9px;display: flex;align-items: center;color: #948F9D;justify-content: flex-end}
.tsOperator>img{margin-right:3px}
/*Task Modal 9-dec-22 End */


/******************************
Jobs Start Here
******************************/
.jobSec .operatorSearch .srchSec input{border: 1px solid #F4F5F6;width: 450px}
.jobSec .srchSec{vertical-align: middle}
.jobsWrapArea{max-width:756px;margin:0 auto}
.jobSec .netevBn{background-color:#fff}
.filterWrap {display: inline-block}
.filterWrap>span{color:#948F9D;font-weight:400;font-size:14px}
.filterWrap button.multiselect{padding-left:0}
.filterWrap span.multiselect-selected-text{font-weight:600}
.jobsList{margin-top:16px}
.jobsList>li{background: #FFFFFF;padding:13px;margin-bottom: 15px;box-shadow: 1.73224px 1.73224px 22px -3.46448px rgba(103, 103, 103, 0.12);border-radius: 9px}
.jobsList>li:last-child{margin-bottom:0}
.jobsUser>img{width:40px;height:40px;border-radius:4px;margin-right:15px}
.userDetails{display: inline-block;vertical-align: top}
.userDetails ul{line-height:15px}
.userDetails>ul>li{display: inline-block;font-size:12px;font-weight:400;color:#5A5564}
.userDetails>span{font-size:16px;color:#000;font-weight:600}
.Jobsdots{float:right}
.jobsDetail{margin:14px 0 12px;font-weight:600;color:#333}
.attachment{margin-bottom:19px}
.attachment>li{margin-right:8px;display: inline-block}
.address{background: #E5E6EA;padding:7px 12px;font-size:12px;width:max-content;border-radius: 4px}
.address>img{margin-right:2px;vertical-align: sub}
.socialChat{float:right}
.socialChat>li{margin-right:20px;display: inline-block}
.socialChat>li>a{color:#948F9D;font-weight:600}
.socialChat>li>a:hover{opacity:0.8}
.socialChat>li:last-child{margin-right:0}
.socialChat>li>a>img{margin-right:4px}
.addNewMdl .modal-dialog {max-width:542px}
.expired{background: #FFD5E1;border-radius: 6px;font-size:12px;color:#FF1856;padding:2px 8px}
.Jobsdots::after{display: none}
.addFile{ display: flex;margin:0 0 20px}
.addFile>li{margin-right:18px}
.addFile>li:last-child{margin-right:0}
.imgName{font-size:10px;font-weight:600;color:#192434;margin:3px 0}
.imageSize{font-size:10px;font-weight:600;color:#9BA7AF;margin-bottom:3px}
.imgAction{padding: 0;margin: 0;display: flex;list-style: none}
.imgAction>li{margin-right:10px}
.imgAction>li:last-child{margin-right:0}
.mb20{margin-bottom:20px !important}
.mt30{margin-top:30px !important}
.userHis{display: flex;margin-bottom:20px}
.userDetailsDiv{background-color:#f9f9f9;padding:9px 15px;margin-left:12px;border-radius:8px;display: flex;padding-bottom:50px}
.userDetailsDiv .userDetails{flex:1;padding-right:25px}
.userDetailsDiv .userDetails span{margin-bottom:9px;display: block}
.userDetailsDiv .userDetails p{color:#746F7E;font-size:14px}
.userTIme{color:#5A5564;font-size:12px}
.cmntSec{display: flex}
.cmntSec>input{border: 1px solid #E5E6EA;border-radius:8px;background-color:#f4f4f4;margin-right:14px}
.cmntSec>button{padding: 8px 12px}


/************************************************ 404 ****************************************/
.oopsPage{text-align: center}
.oopsPage>h2{font-size: 50px;font-weight: 600;margin-bottom: 27px;color: #192434}
.oopsPage>p{font-size: 22px;color: #192434}
.oopsUrl{margin-top: 73px}
.oopsUrl>p{color: rgba(25, 36, 52, 0.3);font-size: 16px;font-weight: 600;margin-bottom: 12px}
/************************************************ 404 End ****************************************/
/************************************************ Toast ****************************************/
.cstmToast .toast-body{padding:13px 18px}
.cstmToast{position: fixed;max-width:417px;top: 37px;right: 0;left: 0;margin: auto;background: #FFFFFF;border: 1px solid #EDEFF0;box-shadow: 1.73224px 1.73224px 13.8579px -3.46448px rgba(103, 103, 103, 0.15);border-radius: 15px}

.toastSec{display: flex}
.toastSec>img{margin-right:14px}
.toastMsg{margin-right: 5px}
.toastMsg>h5{font-size:14px;font-weight:600;color:#192434}
.toastMsg>p{font-size:12px;color:#192434}
/************************************************ Toast End ****************************************/

/********************* Landing Menu item ***********/
.mt100{margin-top:100px !important;}
.menuBg{background: url(../images/landing/bg1.jpg) no-repeat 0 0 / cover;min-height:756px;}
.industries{min-height:856px;background-position: 100% 100%;}
.menuBg .trackingDiv, .industries .trackingDiv{text-align:center;margin-top:100px;}
.menuBg .mangP, .industries .mangP{max-width: 698px;margin: 0 auto;}
.industries .mangP{max-width:1024px;}
.circleimg{max-width:500px;margin:0 auto;}
.circleimg > img{width:100%;}
.circleimgul{margin-top:40px;}
.circleimgul>li{margin-bottom:15px;}
.circleimgul>li:last-child{margin-bottom:0;}
.circleimgul>li>span{font-weight: 600;
    font-size: 20px;color: #5A5564;margin-left:13px;}
.headerdropdown select.form-control{height: inherit;
    padding: 0;
    padding-right: 20px;
    background-color: inherit;filter: brightness(0) invert(1);
    color: #fff;    background-position: calc(100% - 0px);
    border: 0;
    font-size: 16px;
    font-weight: 600;}
.indrow{margin-top:-100px;}
/*************************************************** Responsive Css *****************************************/
@media (min-width:1920px){ 
    .topBg, .rowPull, .testiBg{max-width:1450px;margin: 0 auto}
    .container {max-width: 1450px;padding: 0 130px}
    /* .desktopDevice{position: relative;left: calc(100vh - 1444px)} */
    .desktopDevice>img {width: 120%}
}
@media screen and (max-width:1366px){
    .container{max-width:inherit;width:100%}
}
@media only screen and (max-width: 1919px) and (min-width:1365px){
    .postStatic{position: static}
    .ht700{height:700px}
    .desktopDevice{position: absolute;right: 0}
}
@media only screen and (max-width: 1024px) and (min-width: 768px){
    .navbar-light .navbar-toggler{padding:0;border:0}
    .countrySec > button{margin-top:10px;width: 100%;text-transform: capitalize;margin-bottom:30px}
    .socialUl li a img{max-width: 120px}
    .socialUl li:last-child a img{max-width: 143px}
    .oprtrUl li{padding: 20px 10px}
}
@media screen and (max-width:1210px){
    .beyUl>li{margin-bottom:10px}
}
@media screen and (max-width:991px){
    .navbar-light .navbar-nav .nav-link{margin:0 0 10px}
    .topRight li{display: block;margin: 0 0 10px}
    .startBtn{margin:0}
    .navbar-collapse{margin-top:10px}
    .slick-prev{left: 82%}
    .mobShd{overflow: auto}
    .premiumTbl{width:1024px}
    /* .premiumTbl{float: inherit;margin-top: 28px;border: 0}
    .premiumTbl>thead, .premiumTbl>tbody>tr>td{display: none}
    .premiumTbl tr td:nth-child(1){display:block;width:100%;border: 0;font-weight:600;padding:18px .75rem 18px 50px}
    .premiumTbl tr:first-child td:nth-child(1){border-top:0}
    .freePlan{display: block}
    .premiumTbl tbody{display: flow-root}
    .planMobile{display: block} */
    .comitementUl>li{padding-right: 215px}
    .faqPage .navbar-light .navbar-toggler-icon{background: url(../images/landing/blackMenu.png) no-repeat 0 0 / cover}
    .createAccnt{padding: 76px 22px 66px}
    .accnt>img{width:80%}
}
@media screen and (max-width:767px){
    .testiBg{background:none}
    .happyCstBG{background: linear-gradient(145deg, #2CD8D5 4.71%, #6B8DD6 50.01%, #8E37D7 95.3%), #2EC5CE}
    .cstCarouselBg{background: #DBD7F7;padding-left:0}
    header .navbar-collapse{margin-top:20px}
    .navbar-light .navbar-toggler{padding:0;border:0}
    .navbar-light .navbar-nav .nav-link{margin:0 0 10px}
    .topRight li{display: block;margin: 0 0 10px}
    .startBtn{margin:0}
    .efficientDiv{margin-top:85px}
    .trackingDiv{ position: relative;margin: 0 -15px;padding: 30px 15px;color: #fff;text-align: center}
    .aboutPage .trackingDiv {margin: 38px auto 0;max-width: inherit; padding:0}
    .aboutPage .mangP {font-size: 16px;font-weight: 400}
    .Commitment{margin-top:0}
    .Commitment .hlpCnt {font-size: 14px}
    .comitementUl>li{display: block;padding:0 0 150px}
    .aboutPage .intIcn{width:98px;height:98px;margin-bottom: 13px;line-height: 97px}
    .comitementUl>li>p{font-size:20px;color:#18191F;font-weight:400}
    .comitementUl>li::before { height: 45%;width: 2px;top: 50%;left: 0;right: 0;margin: auto}
    .comitementUl>li::after { top: 70%;left: 0;right: 0;margin: auto;transform: rotate(90deg)}
    .comitementUl>li:last-child{padding-bottom:0}
    .faqAccordion .card-header>button>img{right:5px}
    .trackingDiv>*{position: relative;z-index: 1}
    .trackingDiv>h1{font-size:30px}
    .faqPage .topCmp>h2{font-size:30px}
    .faqPage .hlpCnt {font-size: 16px}
    .mapImg{display: none}
    .countrySec{text-align: left}
    .countrySec > button{margin-top:10px;width: 100%;text-transform: capitalize;margin-bottom: 40px}
    .socialUl{text-align: center}
    .socialUl li{margin-right:8px}
    .socialUl li>a>img{max-width:102px}
    .ptbtm{padding: 40px 0}
    .interfaceDiv{margin: 0 0 15px}
    .mt58 {margin-top: 30px !important}
    .mt58:last-child {margin-top: 0 !important}
    .pb104 {padding-bottom: 55px}
    .happyCst {color: #fff;margin-top: 0;text-align: center;padding: 47px 0 116px}
    .happyCst>h4 {font-size: 26px;font-weight: 700}
    .happyCst>p {font-size: 14px;font-weight: 300}
    .happyCst>p br{display: none}
    .cstCarouselBg{padding-left: 15px}
    .client-slider{max-width:inherit;width:100%;margin-top: -70px}
    .platformDiv>h3{margin-bottom:20px;font-size: 26px}
    .platformDiv>p>span br{display: none}
    .dsktpDiv>.registerBtn {margin: 22px auto 37px}
    .slick-next{right:10px}
    .platformDiv>p{font-size:17px}
    .anuallySwitch{text-align: left}
    .custom-switch{text-align: center}
    .grayMbBg{background: none}
    .rowPull{padding: 0}
    .dsktpDiv{text-align: center;padding: 40px 0 76px}
    .saveAnnual{margin-bottom: 30px;margin-left: 0;max-width:185px}
    .dsktpDiv>h4{font-size: 26px;margin-bottom: 25px}
    .mobileButton{display: block !important}
    .freePlan>button{width: 100%;background: #fff;color: #887BE4;border: 1px solid #887BE4}
    .proPlan>button{width:100%}
    .topCmp>h2{font-size:26px}
    .hlpCnt{font-size:18px}
    .whiteDiv{margin-bottom:30px}
    .mt60{margin-top: 20px}
    .faqAccordion .card-header>button{font-size:20px}
    .mobShd{box-shadow: 2px 2px 16px -4px rgb(103 103 103 / 15%);background: #fff;margin-top: 48px;border-radius: 4px}
    .price{box-shadow: none;margin-top:0;border: 0}
    .price .premHead{display: none}
    .freePrice>li{color:#000;font-weight: 600;font-size:20px}
    .freePrice>li>span{display:block;color:#746F7E;font-size:17px}
    .freePrice li:nth-child(odd){background:#fff}
    #proPlan{display: none}
    .freePrice .premButton{background:#887BE4;color:#fff}
    .cstmMdl .modal-body{padding:16px}
    .form-check{text-align: center;padding: 0;margin-bottom: 20px}
    .frgtPwd{text-align:center}
    .loginBtnMdl{margin-top:30px}
    .mobileMdl .countrySec input{width: 70%}
    #createAccount .modal-body{padding: 16px 16px 60px}
    .crtAccnt>a{display: block}
    .navbar-light .navbar-nav .nav-link{border:0}
    .desktopApp{display: none}
    .mobileApp{display: inline-block}
    .socialUl li a img, .socialUl li:last-child a img{max-width: 100px}
    .dsktpDiv>p{padding-right:0;font-size: 14px}
    .beyUl>li{margin-right:0;margin-bottom:23px}
    .tickCnt{display: inline-block;width: 80%;vertical-align: top}
    .leftBG{padding: 20px 0;position: static;width:100%;background-color:#844ed7;background-position:0% 80%}
    .accnt{position: static}
    .accnt>img{width:120px;margin-bottom: 10px}
    .createAccnt{padding:20px}
    .form .cstmField{margin-bottom:10px}
    .back, .back:hover{margin-top:0}
    .industries{min-height: 1180px;background-position: inherit;}
}
@media screen and (max-width:575px){
    .frgtPwd{text-align: left;margin-top: 20px}
    .helpSearch .srchSec input{width:100%}
    /* .industries{min-height: 1180px;} */
}
@media screen and (max-width:480px){
    .platformDiv .custom-control-label{margin-left: 40px;margin-right: 53px}
    .countrySec input, .mobileMdl .countrySec input{width:65%;padding-left: 5px}
    .saveAnnual{max-width:155px}
    .planMobile>li{padding: 20px 15px}
}



/* 13-Apr-23 premium */
.pr-plan{border: 1px solid #EAEAEA;border-radius: 32px;padding:27px 30px;max-width:768px;margin:0 auto 32px;position: relative;}
.pr-plan:last-child{margin-bottom:0;}
.plandetails{color: #272D39}
.plandetails>img{margin-bottom:14px;}
.planname{letter-spacing: 0.15px;font-weight: 600;font-size: 17px;}
.plansubscription{font-weight: 600;margin-bottom: 15px;font-size: 30px;}
.plansubscription>img{width:10px;}
.plansubscription>span{font-weight: 400;font-size: 14px;}
.planremarks{font-weight: 400;;margin-bottom: 12px;font-size: 14px;}
.planpayment{font-weight: 400;color: #5A5564;font-size: 12px;}
.plandate{font-weight: 600;font-size: 14px;}
.planpurchaseddetails{display: flex;justify-content: end;}
.planpurchased{font-weight: 400;background: rgba(39, 45, 57, 0.1);padding:4px 5px;margin-bottom: 10px;border-radius: 7.20703px;display: inline-block;font-size: 11px;}
.planpurchased>img{margin-right: 5px;}
.planbtn{position: absolute;bottom: 0;right: 0;}
.planbtn>.btn{width:100%;margin-bottom:14px;padding:17px 10px;}
.planbtn>.btn:last-child{margin-bottom:0;}
.cancelSub{background: rgba(136, 123, 228, 0.2);color:#887BE4}

.paymentDetails{border-radius:24px;}
.paymetnLabel{color: #5A5564;font-weight: 400;font-size: 12px;margin-bottom:5px;}
.paymentCard{font-weight: 600;font-size: 14px;}
.paymentCardDetails{display: flex;align-items: center;justify-content: space-between;}
.paymentBtn>a{font-weight: 600;color: #272D39;text-decoration: underline;margin-right:40px;font-size: 12px;}
.paymentBtn>a:last-child{margin-right:0;}
.paymentBtn>.changeCardBtn{color:#887BE4}

.pr-contactDetails{border-radius:24px;max-width:400px;padding:16px 30px;}
.prContact{text-align: center;}
.prContactLabel{font-weight: 600;margin-bottom: 17px;font-size: 17px;}
.prContactList{display: flex;align-items: center;}
.prContactList>li{margin-right:12px;}
.prContactList>li:last-child{margin-right:0;}
.prContactList>li>a{background: #E1DDFE;font-weight: 400;display: block;font-size: 15px;padding:12px 20px;border-radius: 10px;color: #192434;}
.prContactList>li>a:hover{opacity: 0.9;}
.prContactList>li>a>img{margin-right:10px;}

.trialDetails{text-align: center;padding: 30px 50px;}
.trialDetails>img{margin-bottom:20px;}
.trialDetails .alarmHead{font-weight: 600;font-size: 24px;color: #192434;margin-bottom:12px;}
.trialTetx{font-weight: 400;font-size: 14px;color: #272D39;margin-bottom:25px;}
.trilaList{text-align: left;}
.trilaList li{margin-bottom: 12px;}
.trilaList li:last-child{margin-bottom:0;}
.trialDetails .alarmBtn .btn.btn-primary{width:100%;height: 50px;}


.trialPeriod .modal-dialog{max-width:540px;}
.trialPeriod .trialDetails{padding:30px 0;}
.plantinumTrial{position: relative;background: #2f8aeb;border-radius: 24px;overflow: hidden;padding:40px;color:#fff}
.plantinumTrial>img{margin-bottom:16px;}
.plantinumTrial .plansubscription{margin-bottom:0;position: relative;z-index: 1}
.plantiumnPlan{font-weight: 600;font-size: 17px;}
.plantinumTrial::after, .plantinumTrial::before{content:'';position: absolute;height:70px;}
.plantinumTrial::before{background: url(../images/premium/triangletop.svg) no-repeat;width:166px;top:0;left:0;}
.plantinumTrial::after{background: url(../images/premium/trianglrbottom.svg) no-repeat;width:211px;bottom:0;right:0;}
.already>a{margin-top:42px;text-decoration: underline;font-weight: 600;font-size: 14px;color: #272D39;display: inline-block;}
.freeTrial{display: flex;align-items: center;justify-content: space-between;border: 1px solid #EAEAEA;border-radius: 8px;padding: 18px;margin-top: 44px;height: 50px;font-weight: 600;font-size: 14px;color: #887BE4;}
.freeTrial input.cstmChekBox[type='checkbox']:after{border-color:#887BE4}

.flexPriceSec{text-align: center;}
.radio-toolbar{background: #DBD7F7;position: relative;padding: 4px;border-radius:30px;display:inline-block}
.flexPrice{color: #192434;text-align: center;}
.flexPrice h1{font-weight: 600;line-height: 44px;font-size: 32px;margin-bottom: 12px;}
.flexPrice p{font-weight: 400;font-size: 14px;margin-bottom:21px;}
.longArrow{position: absolute;right:-125px;top:-40px}
.naTab{position:relative;border:0;}
.naTab>li>a{display:block;position:relative}
.naTab>li>a input:disabled + label{color: rgba(82, 82, 82, 0.40)}
.naTab>li>a.active .homeBtn{color:#fff}
.naTab>li>a span{font-size:22px;vertical-align:sub;padding-right:5px}
.radio-toolbar input[type="radio"]{opacity:0;cursor:pointer;width:100%;position:absolute;height:100%}
.homeBtn{font-weight: 600;font-size: 14px;line-height: 24px;color: #887BE4;text-align:center;padding:4px 22px;margin:0;cursor:pointer;border:1px solid transparent}
.slider1{display:inline-block;width:30px;border-radius:4px;position:absolute;background: #887BE4;border-radius: 20px;bottom:0;top:0;transition:all .2s linear;}
.planList{margin-top:30px;color: #192434;}
.planList>li{border: 1px solid #DFDBDB;display: inline-block;margin-right:18px;border-radius: 24px;padding:12px 22px;}
.planList>li:last-child{margin-right:0;}

.planname {line-height: 44px;font-size: 20px}
.trilaList li{font-size:12px;color: #272D39;}
.trilaList li img{margin-right:10px;}
.planList .alarmBtn .btn{color: #fff;width: 100%;height: 42px}

.mt65{margin-top:65px;}
.saveAnuallyImg{top: -60px;
    right: -90%;
    position: absolute;}
@media screen and (max-width:767px){
    .planpurchaseddetails{display: inherit;margin-top: 20px;}
    .planbtn{position: inherit;}
    .paymentCardDetails{display: inherit;}
    .paymentBtn{margin-top:10px;}
    .planList>li{display: block;margin:0 0 10px;}
    .longArrow, .saveAnuallyImg{display: none;}
}