html, body{height:100%;}
body{background:#ffffff; color:#000000; padding:0px; font-family:"Circular Std Book", sans-serif;font-size:18px;overflow-x:hidden;text-rendering:optimizeLegibility;text-rendering:geometricPrecision;font-smooth:always;font-smoothing:antialiased;-moz-font-smoothing:antialiased;-webkit-font-smoothing:antialiased;-webkit-font-smoothing:subpixel-antialiased;-moz-osx-font-smoothing:grayscale;}
*, figure, ul, li{margin:0px;padding:0px;list-style:none;}
h1, h2, h3, h4, h5, h6{line-height:normal; margin-bottom: 0;}
a, .btn, button, i{color:#000000;}
a:hover{color:#89C930;}
.trs{-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-ms-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out;}
a:hover, a:focus{text-decoration:none;outline:none;}
img{max-width:100%;}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder{color:#000000;opacity:1;}
input::-moz-placeholder, textarea::-moz-placeholder{color:#000000;opacity:1;}
input:-ms-input-placeholder, textarea:-ms-input-placeholder{color:#000000;opacity:1;}
input:-moz-placeholder, textarea:-moz-placeholder{color:#000000;opacity:1;}

select, input, textarea{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}

/*::-webkit-input-placeholder { color: #909; }
:-moz-placeholder { color: #909; opacity: 1; }
::-moz-placeholder { color: #909; opacity: 1;}
:-ms-input-placeholder { color: #909;}
::-ms-input-placeholder { color: #909;}
::placeholder { color: #909;}*/

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; margin: 0;}

/* input[type=number] {   -moz-appearance: textfield; appearance: textfield; margin: 0; }*/

input[type=number]::-webkit-inner-spin-button { background: url('../images/double-arrow.svg') no-repeat 100% 100%; width: 8px; height: 8px; padding: 6px 4px 6px 4px; background-position: 0px 1px; }


/***********default*********/
@font-face { font-family: 'Circular Std Black'; src:url('../fonts/Circular Std Black.ttf');}
@font-face { font-family: 'Circular Std Bold'; src:url('../fonts/Circular Std Bold.ttf');}
@font-face { font-family: 'Circular Std Book'; src:url('../fonts/Circular Std Book.ttf');}
@font-face { font-family: 'Circular Std Medium'; src:url('../fonts/Circular Std Medium.ttf');}


.container{max-width:1250px;width:100%;}
.container.vehicle-container{max-width:1450px; width:100%;}
.positioRelative{position:relative;}
.verticalyMiddle{position:absolute;top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);}
p{font-size:18px;line-height:28px;font-weight:300;}
.img-cover-area{background:no-repeat center center scroll;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;background-position:top center;}


.btn{padding: 12px 20px 10px 20px; color: #fff;font-size: 15px; margin: 30px auto; font-family: 'Circular Std Medium';  position: relative;
  border-radius: 0px 20px 0px 20px; border: none;}
.btn .web-dash-line{ font-size: 30px; position: absolute; right: 0; bottom: 0px; opacity: 0.5; }

.btn.focus, .btn:focus, .btn-check:active+.btn-warning:focus, .btn-check:checked+.btn-warning:focus, .btn-warning.active:focus, .btn-warning:active:focus, .show>.btn-warning.dropdown-toggle:focus{box-shadow:none;}
.btn-primary{background: rgb(95,183,70); background: linear-gradient(90deg, rgba(95,183,70,1) 30%, rgba(164,213,35,1) 100%);color:#FFFFFF;}
.btn-primary:hover,.btn-primary:focus{background: rgb(95,183,70); background: linear-gradient(90deg, rgba(164,213,35,1) -30%, rgba(95,183,70,1) 100%);}

.show > .btn-primary.dropdown-toggle:focus,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle{background: rgb(95,183,70); background: linear-gradient(90deg, rgba(164,213,35,1) 0%, rgba(95,183,70,1) 100%);box-shadow:none;}

.btn.btn-secondary{border-radius: 10px; padding: 12px 15px; margin: 0;}
.btn-secondary{background: #89C930; color:#FFFFFF;}
.btn-secondary:hover,.btn-secondary:focus{background: #000000;}

.show > .btn-secondary.dropdown-toggle:focus,
.btn-secondary:not(:disabled):not(.disabled).active,
.btn-secondary:not(:disabled):not(.disabled):active,
.show > .btn-secondary.dropdown-toggle{background: #000000; box-shadow:none;}


.default-heading{display:block;position:relative;}
.default-heading h1, .default-heading > a.heading01{font-size:46px;  font-family: 'Circular Std Bold';}
.default-heading h2, .default-heading > a.heading02{font-size:26px;  font-family: 'Circular Std Bold';}
.default-heading h3, .default-heading > a.heading03{font-size:22px;  font-family: 'Circular Std Medium';}
.default-heading h4, .default-heading > a.heading04{font-size:18px;  font-family: 'Circular Std Medium';}
.default-heading h5, .default-heading > a.heading05{font-size:16px;  font-family: 'Circular Std Medium';}
.default-heading h6, .default-heading > a.heading06{font-size:12px;  font-family: 'Circular Std Medium';}

.form-group {position: relative; margin-bottom: 15px; }
.form-group label {color: #B7B5C2; font-size: 16px; font-family: 'Circular Std book'; position: relative; line-height: 16px; min-height: 28px; }
.form-group label span{ position: absolute; top: 0; right: -10px; color: #FF0000; margin-left: 10px; display: block; }
.form-group select {font-size: 16px; padding: 15px 10px; height: auto; color: #000000; }
.form-control, .form-inline .form-controlm, .input-group-lg >.form-control{width: 100%; padding: 15px 10px; font-size: 16px;  color: #000000; background: #FFFFFF; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 10px;}
.input-group-lg >.form-control{ width: auto; border-left: 0;}
.input-group-lg >.form-control:focus{ box-shadow: none; }
.input-group-lg .input-group-text{ border-radius: 10px; background-color:#ffffff; border-radius: 10px; border-right: 0; }

.form-control.minheight, .form-inline .form-control.minheight { min-height: 230px; }
.form-group select.custom-select {background: #ebeff2 url(../images/down-arrow.png); background-repeat: no-repeat; background-position: 98% 16px; background-size: 15px; border: 1px solid #b9c6d3; }
.form-group .input-group.date .input-group-addon {background-color: #ddd; color: #d51b00; padding: 7px 8px; border-radius: 0rem .25rem .25rem 0rem;}
.form-group .input-group.date .input-group-addon .fa { color: #d51b00; }
.form-control:focus, select:focus, .custom-select:focus, .form-select:focus{ box-shadow: none; }
/*.form-control:invalid { border-color: #FF0000; }*/
.contact-form form .btn{ margin: 0; background: #89C930; padding: 10px 35px; }
.contact-form form .btn:hover{ background: #000000; }

/**** Header **/
.headerSection{border-bottom: 2px solid #EDF4FA; padding: 5px 30px; }
.navbar-brand{padding:0px;margin-right:0;font-size:36px;font-weight:700;padding:10px 0;color:#ffffff;text-transform:uppercase; max-width: 170px;}
.navbar-brand span{color:#d51b00;}
.navbar-brand:hover{color:#ffffff;}
.navbar-brand .dotcom{font-size:20px;display:inline-block;margin-left:-10px;font-weight:600;text-transform:inherit;}

.navbar{padding:0;margin-bottom:-4px;}
.navbar .navbar-nav li.nav-item{padding:5px 21px; }
.navbar .navbar-nav li.nav-item > a.nav-link{ padding: 0; font-family: 'Circular Std Medium'; color:#090e2b;font-weight:500;border-bottom:transparent solid 2px;}

.navbar .navbar-nav li.nav-item > a.nav-link:hover,
.navbar .navbar-nav li.nav-item > a.nav-link.active,
.navbar .navbar-nav li.nav-item.show > a.nav-link{color:#000000;border-bottom:#a1d326 solid 3px;}
.navbar .navbar-nav li.nav-item > a.nav-link:hover i,
.navbar .navbar-nav li.nav-item > a.nav-link.active i,
.navbar .navbar-nav li.nav-item.show > a.nav-link i{color:#000000;}
.navbar .navbar-nav .active > .nav-link,
.navbar .navbar-nav .nav-link.active,
.navbar .navbar-nav .nav-link.show,
.navbar .navbar-nav .show > .nav-link,
.navbar .navbar-nav .open > .nav-link{color:#000000;}

.navbar .navbar-collapse{position:relative; flex-grow: 0;}
.navbar-nav .dropdown-menu{min-width:250px;padding:10px 20px;color:#6a6a6a;border-radius:0;border:none;margin:90px 90 90 90;}
.navbar-nav li .dropdown-menu{min-width:250px;padding:10px 15px;color:#6a6a6a;border-radius:0;border:none;margin:0px 0 0 0;}
.navbar-nav li .dropdown-item{  border-bottom:#f0f0f0 solid 1px;padding:10px 0px;margin:0px 10px;font-size:14px;line-height:16px;position:relative;}
.navbar-nav li .dropdown-item:before{position:absolute;background-color:#090e2b;height:5px;width:5px;left:0;top:15px;border-radius:100%;content:"";}
.navbar-nav li .dropdown-item:last-child{border-bottom:0;}
.navbar-nav li .dropdown-item:focus,.navbar-nav li .dropdown-item:hover{background-color:transparent;}
.navbar-nav .dropdown-toggle::after{ display: none; }


.headerSection.menu-fixed{position:fixed;top:0;width:100%;left:0;right:0;z-index:9999;background-color:#ffffff;}



.head-right-area{position:relative;display:flex;align-items:center;padding-right:5px;}
.head-right-area a{ color: #A1D326; font-family: 'Circular Std Medium'; text-decoration: none; display: inline-block; vertical-align: middle;}
.head-right-area a:hover{color:#000000;}
.head-right-area.about-area a{ display: inline-block; padding-left: 20px; }
.head-right-area.about-area a:hover i{color: #A1D326;}
.head-right-area.about-area a:hover span::before{color: #A1D326;}
.head-right-area a.notification{ padding-right: 10px; }
.head-right-area a.notification img{ width: 100%; max-width: 45px; }
.head-right-area a.notification img.hover{ display: none; }
/*.head-right-area a.notification img:hover { cursor: pointer; filter: invert(.9) sepia(20) saturate(20) hue-rotate(25deg);}*/

.head-right-area a.notification:hover img.unhover{ display: none; }
.head-right-area a.notification:hover img.hover{ display: inline-block; }

a.nav-menu-item {
    color: #000000;
} 

a.nav-menu-item:hover {
    background-color:transparent;
} 

a.nav-menu-item:hover span.nav-menu-item, a.nav-menu-item:focus span.nav-menu-item {
    border-bottom: #a1d326 solid 3px;
} 


/**** Hero Image ****/
.hero-section { padding: 30px 0; background-repeat: no-repeat; background-position: top center; min-height:860px; background-size: cover; position:relative;  background-position: center center; padding-bottom: 40%;}
.hero-section:before{ display: none; position: absolute; top: 0;  left: 0; right: 0; min-height: 100%; content: ""; z-index: 0; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+0,0+100;White+to+Transparent */
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */}
.heroTxt{ position: relative;}
.heroTxt .list-group-area{ padding: 20px 15px; text-align: center; }
.heroTxt .list-group-area{ padding:30px 45px 20px 45px; }
.heroTxt .list-group-area li{ font-family: 'Circular Std Medium'; padding-top: 15px; padding-bottom: 15px; font-size: 18px; text-align: left;}
.main-graphic{position: absolute; bottom: 0px; width: 100%; z-index: 0;}

.home-questions.list-group-area li{ text-align: center; }
.home-questions li.item p i{ font-size: 24px; margin-right: 5px; } 

.main-section-area{position: relative; }
.bg-body{background: linear-gradient(8deg, #EEF3F4 -100%, rgba(255, 255, 255, 0) 150%); padding-bottom: 90px; margin-bottom: -90px;}
.bg-body.marPad{ margin-bottom: 0; padding-bottom: 0; }
.section{position:relative; padding:50px 0px;}
.section.ecotally-vehicle-area { padding-top: 10px; }
.section.padd-top{ padding-top: 0; }

.services-area{ margin-top: -90px; }
.services-area .default-heading{ display: inline-block; padding-bottom: 70px; }
.services-area .default-heading h2{ letter-spacing: 0.5px; position: relative;}
.services-area .default-heading h2:before{ background: #89c930; height: 3px; border-radius: 50px; position: absolute; left: 0; right: 0; bottom: 0; width: 100%; max-width: 46px; margin: 0 auto -15px auto; content: ""; }


.services-area .card{position:relative; padding: 40px; min-height: 310px; height: 100%; border:none; box-shadow: 0px 12px 45px rgba(0, 0, 0, 0.09);
border-radius: 20px;}
.services-area .card .card-body{padding:0;}
.services-area .card i{ font-size: 60px; }
.services-area .card p{ font-family: 'Circular Std Medium'; margin:25px 0; font-size: 20px;}

.services-area .arrow-btn { position: absolute; left: 0; right: 0; bottom: -35px; background-color: #89C930; height: 70px; width: 70px; border-radius: 100%; text-align: center;
  padding: 20px;  margin: 0 auto;}
.services-area .arrow-btn > i{ font-size: 24px; }
.services-area{}


.map-area{ position: relative; /*z-index: 1;*/}
.map-area,.image-area{ position: relative;}
.map-area img, .image-area img{border-radius: 80px;}

.flow-box{background: #FFFFFF; box-shadow: 0px 18px 33px rgba(0, 0, 0, 0.08); border-radius: 20px; padding: 30px; display: block; width: 100%; max-width: 400px; position: absolute;
    right: -5%;  bottom: -15%;}
.flow-box .default-heading h3{font-weight: 500; font-size: 30px;}

.flow-box .miles {background-color: #89C930; display: inline-block; border-radius: 5px; margin: 35px 0;}
.flow-box .miles a{color: #fff; font-size: 14px; padding: 10px 15px; display: block; text-decoration: none;}

.current-vehicle{ margin-bottom: 30px;}
.current-vehicle.mar-none{ margin-bottom: 0; }
.current-vehicle.mar-small{ margin-bottom: 30px; }
.list-found.padd .current-vehicle.mar-small{ margin: 15px 0; }
.current-vehicle p{font-weight: 500; font-size: 18px; font-family: 'Circular Std Medium'; margin-bottom: 10px;}

.vehicle-info{ position: relative; display: block; text-align: left; font-size: 15px; padding-left: 30px;}
.vehicle-info > i{ vertical-align: middle; margin-right: 5px; font-size: 20px; max-width: 24px; width: 100%; text-align: center; position: absolute; left: 0; top: 45%;
    transform: translateY(-55%);}
.vehicle-info > i.web-car, .vehicle-info > i.web-meter{ font-size: 15px; }

.vehicle-info > i.web-side-car-enter{ font-size: 24px; margin-top: 3px; margin-left: -2px;}
.vehicle-info .vehicle-part{font-size: 15px; line-height: 15px; vertical-align: middle; display: inline-block; color: #4D4D4D;}
.vehicle-info .vehicle-part i{color: #4D4D4D; font-size: 12px;}

.vehicle-info .vehicle-part.meter-icon{ padding-left: 3px; }

.vehicle-info span{ line-height: 16px; }
.vehicle-info span .web-star-full{ font-size: 12px; }
.vehicle-info span.stars-icons{ padding-left: 3px; }

.details-area{position: relative; }
.details-area.padd-left-top{padding:120px 0px 0 100px;}
.details-area.padd-right-top{padding:120px 100px 0 0;}
.details-area .default-heading{margin-bottom:30px;}
.details-area p{color: #4D4D4D; font-size: 17px;}



.charging-need{position:relative; padding-top: 150px; z-index: 1;}
.card-area{ position: absolute; left: -10%;  bottom:-20%; max-width: 730px; width: 100%;}
.card-area .card{position:relative; overflow: hidden; min-height: 310px; height: 100%; border:none; box-shadow: 0px 12px 45px rgba(0, 0, 0, 0.09);
border-radius: 20px;}
.card-area .card .card-title{ font-size: 19px; color: #000000; text-align: center; font-family: 'Circular Std Medium'; }



.column-items{ /*padding: 30px 30px 0px 30px;*/ }
.column-items h5{font-size: 15px; color: #4D4D4D; max-width: 93px; text-align: center; margin-bottom: 10px;}
.column-items .text-area{font-size: 16px; line-height: 18px; color: #093C6A; font-family: 'Circular Std Medium';}
.column-items .text-area .destination{ font-size: 14px; display: block; }

.gradient-bar{background: linear-gradient(91.06deg, #EEF3F4 -10.21%, rgba(255, 255, 255, 0) 215.78%); padding: 18px 20px; margin-bottom: 20px; margin-top: 20px;}
.gradient-bar i, .gradient-bar span{ display: inline-block; vertical-align: middle; margin-right: 10px; font-family: 'Circular Std Medium';  }
.gradient-bar i{ font-size: 24px; }
.gradient-bar small{ font-size: 12px; color: #A1A2A6; margin-left: 5px; }



.purchase-vehicle{ position: relative; padding-top: 180px; z-index: 1;}
.purchase-vehicle .card-area{ right: -10%; left: auto; bottom: -60%;}
.purchase-vehicle .card-area .card .card-title,
.support-environment .card-area .card .card-title,
.minimal-effort .card-area .card .card-title{ font-size: 18px; text-align: left; margin-bottom: 15px;}
.purchase-vehicle .card-area .card .card-title .rounded-circle,
.support-environment .card-area .card .card-title .rounded-circle,
.minimal-effort .card-area .card .card-title .rounded-circle{ margin-right: 45px; max-width: 25px; }
.purchase-vehicle .card-area .card .column-items{padding-top: 10px; padding-bottom: 10px; }
.purchase-vehicle .card-area .card .column-items h5,
.support-environment .card-area .card .column-items h5,
.minimal-effort .card-area .card .column-items h5{ max-width: inherit; text-align: left;}
.purchase-vehicle .card-area .card .gradient-bar{ margin-top: 0; }
.row-area{ margin-bottom: 25px; }

.support-environment{padding-top: 360px;}
.support-environment .card-area{ right: auto; left: -10%; bottom: -15%;}

.minimal-effort, .privacy{ padding-top: 150px; }
.minimal-effort .card-area{left: auto; right: -5%; bottom: -13%;}
.minimal-effort .card-area .card{min-height: inherit; height: auto;  margin-bottom: 15px; overflow: inherit;}
.minimal-effort .card-area .card .card-body{padding-bottom: 30px;}
.circle-show-faster{ position: absolute; right: -10%; }
.minimal-effort .details-area.padd-left-top{ padding-left: 100px; }



/****************Footer Sart***************/
.footer-area{position:relative; background-color: #6C6975; color: #fff; border-radius: 0px 100px 0px 0px; z-index: 1;}
/*.footer-area.trip-page-footer{ display: none; }*/
.footer-area::before { content: ''; border-bottom: 10px solid #89C930; width: 16%; display: block; border-radius: 0 20px 20px 0px; position: relative; top: -5px;}

.footer-area .default-heading{ padding: 100px 0 60px 0; }
.footer-area .default-heading h2{ font-size: 36px; font-family: 'Circular Std Book';}

.footer-col{position:relative;display:inline-block;width:100%;max-width:33%;margin-right:-4px;vertical-align:top;padding-top:30px;padding-bottom:30px;}
.footer-col p{color:#ffffff;font-weight:300;}
.footer-col h5{margin-bottom:20px;color:#ffffff; font-size: 20px;}
.footer-col ul{list-style:inherit;margin:0;}
.footer-col ul li{display:block;margin-bottom:3px;position:relative;}
.footer-col ul li:last-child{margin-bottom:0;}
.footer-col ul li a{color:#c4c3c8; position:relative; text-decoration: none;}
.footer-col ul li a i{ color: #c4c3c8; font-size: 18px; margin-right: 10px;  vertical-align: middle;}
.footer-col ul li a i:before{color: #c4c3c8;}
.footer-col ul li:hover a, 
.footer-col ul li:hover a i:before{color:#89c930;}

.Copyright{display:block;position:relative;padding:25px 0; border-top: #75727d solid 2px;}
.Copyright p{color:#c4c3c8;margin-bottom:0; font-size: 16px; line-height: 20px;}
.Copyright ul{list-style:none;text-align:right;}
.Copyright ul li{display:inline-block;vertical-align:middle;padding-left:15px;}
.Copyright ul li a{color:#c4c3c8; font-size: 16px; line-height: 20px; text-decoration: none;}
.Copyright ul li a:hover{color:#89c930;}



/******* About Us *****/

.information{background-color: #F2F5ED; padding: 140px 0 230px 0; margin-top: 50px; margin-bottom: -90px; position: relative; z-index: 0;}
.information h3{color: #89C930; font-size: 36px; font-family: 'Circular Std Medium';}
.badge-secondary {color: #fff; background-color: #89C930; font-family: 'Circular Std Medium'; font-weight: 300; font-size: 11px; width: 22px; height: 22px; border-radius: 50px; line-height: 22px; padding: 0; position: absolute; right: 0; margin-top: -8px;}

.inner-hero-setion.hero-section{  min-height:550px; /*padding-bottom: 0;*/ background-position: bottom, center;}
.inner-hero-setion.hero-section .heroTxt{ position: absolute; top: 25%; left: 0; right: 0; }
.inner-hero-setion.hero-section .heroTxt .default-heading{ margin-bottom: 15px; }
.inner-hero-setion.hero-section .heroTxt p{font-size: 24px; line-height: 30px; font-family: 'Circular Std Medium';}

.integrity{position: relative; padding: 30px 0 70px 0; max-width: 500px; width: 100%; margin: 0 auto;}
.integrity .default-heading h2{font-size: 42px; line-height: 53px; color: #89C930;}

.infoBox { text-align: center; position: relative; width: 100%; max-width: 950px; margin: -60px auto 0 auto;}
.infoBox:before{width: 70%; margin: 0 auto; height: 6px; background-color: #89C930; position: absolute; left: 0; right: 0; content: ""; top:48%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);}
.infoBox .default-heading h2 { font-family: 'Circular Std Black'; color: #4D4D4D;}

.infoBox .web-leaf{ position: relative; font-size: 50px; padding: 25px 0;}

.infoBox p{font-size: 16px; font-family: 'Circular Std Medium';}
.infoBox img{margin: 20px 0; position: relative; z-index: 1;}


/***** Contact Us ****/
.location-map-area{ padding: 0; margin-bottom: -90px; }
.contact-us{ margin-top: -90px; margin-bottom: -90px; z-index: 1; padding-left: 30px; padding-right: 30px; }
.contact-us .default-heading.eco-tally-heading h2{font-weight: 900; font-size: 42px; line-height: 53px; font-family: 'Circular Std Medium'; color: #89C930;}
.contact-us .default-heading.eco-tally-heading h2 span{font-family: 'Circular Std Book'; color: #000000;}
.address{ position: relative; margin-bottom: 50px; display: block;}
.address h6{ margin-bottom: 10px; font-weight: 600; }
.address p{padding-left: 30px; position: relative; line-height: 22px; font-size: 16px;}
.address p i{ position: absolute; left: 0; top: 5px; }
.address .btn{ max-width: 150px; width: 100%; text-align: left; margin: 0 5px 0 0px; }
.address .btn i{ font-size: 24px; }

.contact-form { margin-bottom: 15px; padding: 30px; margin-top: -170px; background: #FFFFFF; box-shadow: 0px 12px 45px rgba(0, 0, 0, 0.09); border-radius: 20px;}
.contact-form .default-heading{ margin-bottom: 30px; }


.footer-contact-us.footer-area .get-start-btn,
.footer-contact-us.footer-area .default-heading{ padding: 60px 0 40px 0; }

.get-start-btn{ text-align: right; }
.get-start-btn .btn{ max-width: 150px; width: 100%; border-radius: 4px; }
.copy-contact-us{border: none;}
.copy-contact-us ul{ text-align: inherit; }
.copy-contact-us ul li a i:before{ color: #c4c3c8; }
.copy-contact-us ul li a:hover i:before{color:#89c930;}
.copy-contact-us ul.social-icons{ display: block; text-align: right; }


/***** Vehicles *****/
.ecotally-vehicle-area{ position: relative; }

.filter-area{ margin-bottom: 30px; }
.filter-area .dropdown-toggle::after{ display: none; }
.filter-area .card{border: 1px solid #E3E2E9; border-radius: 15px; background-color: #ffffff;}
.filter-area .card-header{ border-bottom: none; padding: 12px 15px; font-family: 'Circular Std Medium'; cursor: pointer; border-radius: 15px 15px 0px 0px; background: linear-gradient(91.06deg, #EEF3F4 -10.21%, rgba(255, 255, 255, 0) 215.78%);}
.filter-area .card-header span{ width: 100%;  max-width: 92%; vertical-align: middle; display: inline-block; font-size: 14px;}
.filter-area .web-down-arrow{ display: inline-block; vertical-align: middle; font-size: 10px;}
.filter-area .card-header.show .web-down-arrow{transform: rotate(-180deg);}
.filter-area .card-header.dropdown-toggle{border-radius: 15px;}
.filter-area .card-header.dropdown-toggle.show{ border-radius: 15px 15px 0px 0px;}

.filter-area .dropdown-menu{ position: relative !important; transform:translate(0px, 0px) !important; background: none; border:0; border-radius:0; padding: 15px; }
.filter-area .dropdown-menu ul li a{ border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 5px; display:block; padding: 8px;  text-align: center; text-decoration: none; }
.filter-area .dropdown-menu ul li a span{ display: block; margin-top: 2px; font-size: 14px;}
.filter-area .dropdown-menu ul li a:hover,
.filter-area .dropdown-menu ul li a.active{background: #89C930;}
.filter-area .dropdown-menu ul li a:hover i:before,
.filter-area .dropdown-menu ul li a.active i:before,
.filter-area .dropdown-menu ul li a:hover span,
.filter-area .dropdown-menu ul li a.active span{ color: #ffffff; }
.filter-area .dropdown-menu.make { height: 400px; padding: 0px; }
.filter-area .dropdown-menu .make-content { overflow-y: auto; height: 100%; padding: 0px; }
.filter-area .dropdown-menu .make-content .content-holder { padding: 15px; }

/*.mCustomScrollbar { height:400px; overflow-y: auto; margin-right: 15px; }*/
/*.filter-area .dropdown-menu .mCSB_scrollTools { padding-left: 15px; margin-left: 15px; left: 15px; }*/
/*.filter-area .mCSB_scrollTools{ right: -5px !important;}*/
/*.filter-area .mCustomScrollbar{ height:100%; }*/
/*.mCSB_draggerRail( height: 360px !important; )*/
.filter-area .mCSB_scrollTools{ right: 3px; padding-left: 10px !important;}
/*.filter-area .mCSB_scrollTools{ right: -3px !important;}*/
/*.make-content.mCustomScrollbar{ height:100%; }*/
/*.filter-area .mCustomScrollbar{ height:100%; } */
/*.filter-area .mCSB_scrollTools .mCSB_draggerRail{ background-color: #b7b5c2; height:100% !important;}*/
/*.filter-area .mCSB_draggerRail( height: 100% !important; )*/

.form-check{ min-height: 30px;  padding-left: 2em; margin-bottom: -10px;}
.form-check .form-check-input{ width: 20px; height: 20px; margin-left: -1.95em; margin-top: 0;}
.form-check-input:focus{ box-shadow: none; }
.form-check-input:checked[type=checkbox]{background: none; background-color: #89C930; border-color: #89C930; position: relative;}
.form-check-input:checked[type=checkbox]:before{content: "\e912";  color: #fff; font-family: 'ecotally'; position: absolute; left: 0; right: 0; top: 2px; margin: 0 auto; text-align: center; font-size: 12px; }
.form-check-label{ font-size: 14px; }

.vehicle-list{ position: relative; }
.vehicle-list .dropdown .btn{background: #FFFFFF; color: #000; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 10px; font-size: 14px; margin:0 0 0 auto; display: block; padding: 12px 25px;}
.vehicle-list .dropdown .btn.dropdown-toggle::after{ content: "\e91e";  color: #b7b5c2; font-family: 'ecotally'; border: none; font-size: 10px; top: 5px; left: 10px; position: relative;}
.vehicle-list .dropdown-item { font-size: 14px; padding-top: 1px; padding-bottom: 1px; }


.list-found{ display: block; margin-top: 25px; background: #FFFFFF; border: 1px solid #E3E2E9; border-radius: 20px; overflow: hidden; padding-right: 15px;}
.list-found.variant{ display: block; margin-top: 5px; background: #FFFFFF; border: 1px solid #E3E2E9; border-radius: 20px; overflow: hidden; padding-right: 15px;}
.list-found.padd{ padding: 20px; }
.list-found .default-heading h2 { display: block; font-size: 24px; }
.list-found .default-heading h2 span{ display: block; font-size: 18px; }

.list-found.padd .vehicle-details{ padding: 20px 0px 20px 0px; }

.progress-border{ position: relative; margin-bottom: -20px; }
.progress-border:after{ position: absolute; height: 120%; top:0; right: 0; border-right: 1px solid #E3E2E9; content: "";}

@media (min-width:768px){
	.variant-border{ position: relative;  }
	.variant-border:after{ position: absolute; height: 70%; top:15%; right: 15px; border-right: 1px solid #E3E2E9; content: "";}
}
.total-mi.progress{ height: inherit; border-radius: 8px 0 0 0;}
/*.total-mi.progress .web-power{ display: block; background: #89C930; width: 100%; max-width: 50px; line-height: 30px; text-align: center; border-radius: 8px 0 0 0; }
*/
.total-mi.progress .progress-bar.value{ min-height:25px; }
.total-mi.progress .progress-bar.bar{ min-height:12px; }
.total-mi.progress .progress-bar{ position: relative; }
.total-mi.progress .progress-bar.elec{ background-color: #89C930; !important; color: #89C930; }
.total-mi.progress .progress-bar.elec .progress-value i{ color: #89C930 !important; }

.total-mi.progress .progress-bar.bg-success{background-color: #EBFFCE !important; }
.total-mi.progress .progress-value{ position: absolute; right: 5px;}
.total-mi.progress .web-power{ color:#89C930 !important; }

.progressbar-title{ font-size: 14px; color: #49657E; }
.total-mi.progressbar-title .progress-bar{ background: none; color: #49657E; }
.progressbar-title.padd-right{ padding-right: 100px; }

@-webkit-keyframes animate-positive{
    0%{ width: 0; }
}
@keyframes animate-positive{
    0%{ width: 0; }
}
.top-line{ border-bottom: #E8E7EE solid 2px; margin-top: 0px; }

.bottom-line{ border-top: #E8E7EE solid 1px; margin-top: 0px; }
.bottom-line span{  border-left: #E8E7EE solid 1px; height: 5px; position: relative;}
.bottom-line span:last-child{border-right: #E8E7EE solid 1px;}
/*.bottom-line span:before{ height: 5px; width: 1px; position: absolute; margin: 0 auto; left: 0; right: 0; bottom: -5px; content: ""; background-color: #E8E7EE; }
.bottom-line span:first-child:before{ right: auto; left: 0; }
.bottom-line span:last-child:before{ right: 0; left: auto; }*/
.total-mi.progress{ background-color: inherit; position: relative;}

.save{ position: relative; width: 100%; max-width: 45px; margin: 10px 0 0 auto; padding: 6px 10px 6px 10px; text-align: center; text-decoration: none !important;}
.save p{ color: #89C930; font-size: 12px; margin-bottom: 0; line-height: 16px; text-decoration-line: none !important; }
.save:before{content: "\e935";  color: #89c930; font-family: 'ecotally'; position: absolute; left: 0; line-height: 1; right: 0; top:0; font-size: 65px;}
/* ian add below -  not working*/
a:link.save-btn,
a:visited.save-btn,
a:active.save-btn,
a:hover.save-btn
  { text-decoration-line: none !important; } 
a.save-btn { text-decoration-line: none !important; } 
  
.save.active i{color: #ffffff; background-color: #89c930;}


.price-gas{ position: relative; padding-top: 30px; padding-bottom: 15px; }
.price{ display: block; position: relative; font-size: 18px; line-height: 1; color:#89C930; font-family: 'Circular Std Medium';}
.price.padbottom{ padding-bottom: 15px; }
.gas-station{ display: block; position: relative; font-size: 15px; color:#89C930;}
.gas-station.padbottom{ padding-bottom: 15px; }
.gas-station i{font-size: 20px; margin-right: 10px; }
.gas-station .variant { margin-left: auto; }

.progress-area{ display: block; position: relative; margin-bottom: 5px; margin-top: 5px; }
.progress-area i{ font-size: 24px; vertical-align: top; margin-right: 5px; width: 100%; max-width: 25px; text-align: center;}
.progress-area i, .progress-percent, .progress-value{ display: inline-block; }

.progress-percent{ width: 100%; max-width: 65%; }
.progress-percent .progress{/*width: 100%; min-width: 115px;*/ height: 6px;}
.progress-percent .progress .progress-bar{animation: progress 2s;}
.progress-percent .progress .progress-bar.bg-success{background-color: #89C930 !important;}
.progress-percent span{ font-size: 16px;  display: block;}



@media (max-width:576px){
	.list-found .progress-percent{ width: 100%; max-width: 80%; }
}
@media (min-width:576px) and (max-width:768px){
	.list-found .progress-percent{ width: 100%; max-width: 75%; }
}

@-webkit-keyframes progress{
    0% { width: 0%;}
}
@keyframes progress{
    0% { width:0%; }
}




.pagination-bar{ padding: 30px 0; display: block; }

.pagination-bar .pagination .page-item a{ color: #A1A2A6; background-color: inherit; padding: 5px 5px; margin: 0 5px; text-align: center; width: 40px; height: 40px; border: none; }
.pagination-bar .pagination .page-item a:hover,
.pagination-bar .pagination .page-item a.active{ background-color: #ffffff; color: #89C930;}

.pagination-bar .pagination .page-item a.left-arrow, 
.pagination-bar .pagination .page-item a.right-arrow{ padding: 5px 5px; text-align: center; width: 40px; height: 40px; background: #BDBCC5;
border-radius: 3px;}

.pagination-bar .pagination .page-item a.left-arrow:hover, .pagination-bar .pagination .page-item a.right-arrow.active{background: #89C930;}

.car-year.vehicle-list{ padding: 30px 0; }
.car-year.vehicle-list .default-heading{display: inline-block; margin-right: 17px;}
.car-year.vehicle-list .default-heading span{ color: #89C930; font-size: 12px; }
.car-year.vehicle-list .dropdown{ display: inline-block; vertical-align: middle; min-width: 230px; width: 230px}
.car-year.vehicle-list .dropdown .btn{width: 100%; padding: 5px 20px 5px 10px;}
.car-year.vehicle-list .dropdown .btn:after{ padding-right: 15px;}
.car-year.vehicle-list .dropdown .btn p{ margin: 0; font-size: 12px; color: #ccc; line-height: 18px;}
.car-year.vehicle-list .dropdown .btn .web-car{ margin-right: 10px; }
.car-year.vehicle-list .dropdown .btn.dropdown-toggle::after{top: -3px; left: 25px;}
.car-year.vehicle-list .dropdown .dropdown-item{ line-height: 26px; }

.vehicle-usage.dropdown .btn{width: 100% !important; max-width: 250px !important; margin: 0px 0px; padding: 5px 20px 5px 10px; }
.vehicle-usage.dropdown {width: 100% !important; min-width: 100px !important; }
.btn.dropdown-toggle::after{ padding: 0px 0px 0px 10px; top: -3px !important; left: 25px !important;}
/*.vehicle-usage.dropdown .btn.dropdown-toggle::after{ position: absolute !important; right: 10% !important; top: 50% !important; }*/


.car-img{ margin-bottom: 15px; }
.car-img.margBottom{ margin-bottom: 0; }
.car-img.radius{ border-radius: 15px; margin-bottom: 0;  overflow: hidden;}

.car-slider .item{ max-height: 400px; }
.car-slider .owl-nav{ top: 50%; transform: translateY(-50%); left: 0; right: 0; }
.car-slider.owl-carousel .owl-nav button.owl-prev, 
.car-slider.owl-carousel .owl-nav button.owl-next{ display: inline-block; background-color: rgba(18, 31, 43, 0.84); border: none; width: 28px;  height: 28px; line-height: 0; }
.car-slider.owl-carousel .owl-nav button.owl-prev i, 
.car-slider.owl-carousel .owl-nav button.owl-next i{ line-height: 0; }
.car-slider.owl-carousel .owl-nav button.owl-prev i:before, 
.car-slider.owl-carousel .owl-nav button.owl-next i:before{ color: #ffffff; font-size: 14px; }
.car-slider.owl-carousel.desktop .owl-prev {opacity: 0 !important;}
.car-slider.owl-carousel.desktop .owl-next {opacity: 0 !important;}
.car-slider.owl-carousel.desktop:hover .owl-prev {opacity: 1 !important;}
.car-slider.owl-carousel.desktop:hover .owl-next {opacity: 1 !important;}

.vehicle-img{ cursor: pointer; background: rgba(18, 31, 43, 0.84); overflow: hidden; position: relative; }
.vehicle-img img{width: 100%; transition: all 0.5s ease 0s;}
.vehicle-img .box-content { color: #fff; text-align: center; width: 90%; /*opacity: 0;*/ /*background: rgba(18, 31, 43, 0.84);*/ transform: translateX(-50%) translateY(50%); position: absolute; bottom: 50%; left: 50%; z-index: 2; transition: all 0.5s ease 0.2s;}
.vehicle-img.multi-images:before{background: rgba(18, 31, 43, 0.84); left: 0; right: 0; top: 0; bottom: 0; position: absolute; content: "";}
/*.vehicle-img:hover img { opacity: 0.15; transform: scale(1.1); transform-origin: left top;}
.vehicle-img:hover .box-content{ opacity: 1; }*/

.filter-atoz{ position: relative; text-align: right; padding: 0px 0px ;}
.filter-atoz a{ font-size: 46px; padding-left: 5px; }




.vehicle-fit{background: #FFFFFF; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 20px;}
.vehicle-fit .card-body{ padding: 0; }
.vehicle-fit .card-body .card-title{ display: block; text-align: center; padding: 40px 0 20px 0;}
.vehicle-fit .card-body .card-title span{ font-size: 14px; color: #A1A2A6; display: block;}
.vehicle-fit .card-body .progress-area{ padding:0 12px; margin-bottom: 15px;}
.vehicle-fit .card-body .progress-area .progress-percent{ max-width: 75%; }
.vehicle-fit .card-body .gradient-bar{ margin-top: 0; }
.vehicle-fit .card-body .bordertop{border-top: 1px solid #E3E2E9;}
.vehicle-fit .card-body .borderrigh{border-right: 1px solid #E3E2E9;}
.vehicle-fit .card-body .column-items{ min-height: 190px; }
.vehicle-fit .card-body .column-items h5{ margin: 0 auto 10px auto; }

.my-fit-lock {  
	position: absolute; /* Stays fixed on the screen */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3); /* Gray overlay with transparency */
    color: white; /* Text color */
    display: flex; /* Centering content */
    align-items: center; /* Center vertically */
    justify-content: center; /* Center horizontally */
    z-index: 1000; /* Ensure it’s on top of other content */
    transition: opacity 0.3s ease; /* Smooth transition for showing/hiding */
}

.my-fit-lock-content {
    text-align: center;
    /*background: rgba(0, 0, 0, 0.7); */ /* Slightly darker background for the content */
    padding: 20px;
	font-size: 16px;
    /*border-radius: 5px;*/
}

.my-fit-lock-content a {
	color: white;
	text-decoration-line: none;
}

.my-fit-lock a:hover{color:#89C930;}

.my-fit-lock-content i {
	color: white;
	text-decoration: none;
	font-size: 14px;
}

.current-vehicle-btn{ position: absolute; top: 0; right: 0; }
.current-vehicle-btn .btn-warning{background: #F1B04D; margin: 0; font-size: 12px;}
.current-vehicle-btn .btn-primary{background: #89C930; margin: 0; font-size: 12px;}
/*.current-vehicle-btn .btn-warning:hover,
.current-vehicle-btn .btn-primary:hover{ color: #ffffff; background-color: #000000; }*/

.current-vehicle-btn .btn.btn-warning:hover{color: #ffffff; background-color: #F1B04D;}
.current-vehicle-btn .btn.btn-primary:hover{color: #ffffff; background-color: #89C930;} 
.current-vehicle-btn .btn.btn-check:focus+.btn-warning, .current-vehicle-btn .btn.btn-warning:focus{ color: #ffffff; }

.car-name{ display: inline-block; vertical-align: middle; text-align: left; }


.table{ position: relative; }
/*.table:before{ position: absolute; height: 100%; width: 1px; left: 25%; top: 0; bottom: 0; content: ""; background:rgba(227, 226, 233, 0.54); }
.table:after{ position: absolute; height: 100%; width: 1px; right: 43%; top: 0; bottom: 0; content: ""; background:rgba(227, 226, 233, 0.54); }
.desktop-table:after{ position: absolute; height: 85%;  width: 1px; right: 12.5%; top: 6%; bottom: 12.5%; width: 1px;  content: ""; background:rgba(227, 226, 233, 0.54); }
*/
.desktop-table{position: relative;}

.table tr th{ border: none; color: #A1A2A6; font-size: 15px; margin-bottom: 15px;  font-weight: 400; }
.table>:not(:first-child){ border: none; }
.table tbody, .table td, .table tfoot, 
.table th, .table thead, .table tr{ vertical-align: middle; border-color: rgba(227, 226, 233, 0.54);}
.table tbody tr{font-family: 'Circular Std Bold';}
.table tr:last-child td{border-color: inherit; border: none;}
.table td.greenTxt{ color: #89C930;}

.table .btn{display: block; margin: 0px auto; width: 100%; max-width: 200px; padding: 6px 20px;}
.table .btn.btn-warning{ background-color: #F1B04D; border-color:#F1B04D; }
.table .btn.btn-primary{ background: #89C930; border-color:#89C930; }
.border-right-td{ border-right: 1px solid rgba(227, 226, 233, 0.54) !important; margin-right: 10px !important; padding-right: 10px !important; } !important


.table-area{ background: #FFFFFF; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 20px; padding: 25px;}
.table-area.paadNOne{ padding: 0; }
.table-area, .table-area p{ font-size: 14px; }
.row-list{ display: block; position: relative;}
.row-list li{padding: 20px 0; text-align: center; display: block;}
.row-list li:first-child{border-bottom:#E3E2E9 solid 1px;}
/*.row-list li.equal-coumn{ display: inline-block; margin-right: -3px; width: 100%; max-width: 30%; border-right:#A1A2A6 solid 1px;}
.row-list li.small-coumn{display: inline-block; margin-right: -3px; width: 100%; max-width: 10%; }*/
.row-list li h6{ color: #A1A2A6; font-size: 15px; margin-bottom: 10px; }
.row-list li p{font-size: 15px; line-height: 16px; margin: 0;  position: relative;}
.row-list li p.greenTxt{ color: #89C930;}

.owl-carousel .owl-item img{ width: auto; }
.owl-nav{ position: absolute; top: -45px; left: 0; right: 0;}
.owl-carousel .owl-nav button.owl-prev, 
.owl-carousel .owl-nav button.owl-next{ background: #FFFFFF; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 3px; padding: 5px; width: 32px; height: 32px; line-height: 28px; text-align: center; }
.owl-carousel .owl-nav button.owl-next{ position: absolute; right: 0; }
.owl-nav i:before{ font-size: 18px; color: #A1A2A6; }

.owl-carousel .owl-dots{ text-align: center; padding-bottom: 15px; }
.owl-carousel .owl-dots button.owl-dot{ height: 12px; width: 12px; border-radius: 100%; margin: 0 5px; background: #E3E2E9;}
.column-items h5{ font-size: 14px; }
.owl-carousel .owl-dots button.owl-dot:hover,
.owl-carousel .owl-dots button.owl-dot.active{background: #89C930;}

.owl-carousel .btn { display: block; margin: 0px auto 15px auto; width: 100%; max-width: 200px; padding: 6px 20px;}
.owl-carousel .btn.btn-warning {    background-color: #F1B04D;    border-color: #F1B04D;}
.owl-carousel .btn.btn-primary {    background: #89C930;    border-color: #89C930;}



.skill{width: 80px; height: 80px; border-radius: 50%; margin: 0 auto; position: relative;}

.days-number{ color: #89C930; font-family: 'Circular Std Medium'; font-size: 15px; padding: 22px 0; line-height: 16px; text-align: center;}
.days-number span{font-family: 'Circular Std Medium'; font-size: 15px; text-align: center; color: #89C930;}

/*
.skill circle{ fill: none; stroke:url(#GradientColor); stroke-width:12px; stroke-dasharray: 150; stroke-dashoffset:0; animation: anim 2s linear forwards;}
.skill svg{ position: absolute; top: 0; left: 0; width: 80px;  height: 80px;}
*/


.skill circle{ fill: none; }


.skill svg{ position: absolute; top: 0; left: 0; width: 80px;  height: 80px;}
.days-plot svg{ position: absolute; top: 0; left: 0; width: 80px;  height: 80px;}
.days-plot 

@keyframes anim {

    100%{
        stroke-dashoffset:150;
    }
}


.charging-rate{ position: relative; }
.charging-rate .default-heading{ display: block; text-align: center; padding: 20px 0; }
.charging-rate .default-heading i{ font-size: 36px; }

.charging-rate h5{ font-size: 16px; text-align: center; font-family: 'Circular Std Medium'; }
.charging-rate figure{ padding: 50px 0; text-align: center; position: relative;}
.count-text{ font-size: 16px; line-height: 16px; text-align: center; color: #89C930; }
.charging-rate figure .img-svg{ position: absolute; left: 0; right: 0; margin: 0 auto; top: 50%; transform: translateY(-50%); }
.charging-rate .hour-minute-second{ display: block; text-align: center; line-height: 22px; color: #4D4D4D;}
.charging-rate .hour-minute-second strong{ font-size: 24px; }
.charging-rate .hour-minute-second p{ font-size: 18px; }

#timer .number-count { text-align: center; color: #89C930;}



.vehicle-trip.section{ padding:0px 0; background-color: white; /*height: 100vh;*/ }
/*.sidebar{background: #FFFFFF; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 20px 0px 0px 20px; padding: 20px 0 0 0; position: relative; z-index: 1; padding-top: 100px;}*/
.sidebar{background: #FFFFFF; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 20px 0px 0px 20px; padding: 20px 0 0 0; position: relative; z-index: 1; padding-top: 100px; height: 100vh; } /*height: 100vh;*/
.mCustomScrollbar{ height: 100%; max-height: 100%; -webkit-overflow-scrolling: touch;}
.mCSB_inside > .mCSB_container{ padding-right: 9px; margin-right: 0; }
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{width: 5px; background-color:#89C930; border:#89C930 solid 1px;}
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger:focus .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, 
.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{background-color:#89C930; border:#89C930 solid 1px;}
/*.mCSB_draggerRail{ display: none; }*/
.mCSB_scrollTools .mCSB_draggerRail{ background-color: #b7b5c2; }

.sidebar_content{ overflow-y: auto }
.sidebar_content .mCSB_scrollTools{ right: -3px;}
.sidebar_content.mCustomScrollbar{ height:100%; }

.trips-items{ display: block; margin-bottom: 50px; text-align: center; }
.trips-items .btn{ margin-top: 0; margin-bottom: 25px; }

.trips-items .btn.btn-warning{background: #F1B04D; padding: 10px 25px; font-size: 12px; max-width: 180px;width: 100%; cursor: auto; }
.trips-items .btn.btn-primary{background: #89C930; padding: 10px 25px; font-size: 12px; max-width: 180px;width: 100%;  cursor: auto; margin-top: 0px;}

.trips-items .btn.btn-warning:hover{color: #ffffff; background-color: #F1B04D;}
.trips-items .btn.btn-primary:hover{color: #ffffff; background-color: #89C930;} 

.trips-items .btn.btn-check:focus+.btn-warning, .trips-items .btn.btn-warning:focus{ color: #ffffff; }

.trips-items .card-title{ display: block; text-align: center; padding: 8px 0 8px 0; margin-bottom:20px; position: relative;}
.trips-items .card-title .car-name{ margin-right: 15px; }
.trips-items .card-title .web-petrol-pump, .trips-items .card-title .web-power-petrol-pump{ margin-left: -10px; }
.trips-items .card-title .destnation { font-size: 14px; color: #A1A2A6; display: block;}

.btn-group{ border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 10px; display: block; padding: 5px;  margin-bottom: 15px;}
.btn-group .btn.btn-outline-primary{ color: #000000; margin: 0; border-radius: 0; background-color: inherit;}
.btn-group .btn.btn-outline-primary:hover,
.btn-group .btn.btn-outline-primary.active{ background-color: inherit; border-color: inherit; }
.btn-group .btn-outline-primary:active:focus{ box-shadow: none; }

.sidebar .current-vehicle{  width: 100%; max-width: 300px; margin-left: auto; margin-right: auto;}

.sidebar .btn-group .btn.btn-outline-primary{ padding-left: 15px; padding-right: 15px; }
.trips-items{max-width: 350px; width: 100%; margin-left: auto; margin-right: auto;}
.trips-items .dropdown .card-title{background: #FFFFFF; border: 1px solid #E3E2E9; border-radius: 10px; padding: 8px 45px 8px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;}
.trips-items .dropdown .card-title .web-down-arrow {  display: inline-block; vertical-align: middle; font-size: 10px; position: absolute; right: 12px; top: 50%; transform: translateY(-50%);}
.trips-items .dropdown .card-title.show .web-down-arrow { transform: rotate(-180deg); margin-top: -5px;}

.trips-items .dropdown .card-title.dropdown-toggle::after{ display: none; }
.trips-items .dropdown .dropdown-menu{ position: relative !important; border: none; padding: 0 !important; transform: none !important;}

.timeline{ margin-top: 25px; margin-left: auto; margin-right: auto; }
.timeline .timeline-item{ position: relative; padding-left: 35px; width: 100%; max-width: 355px; margin-left: auto; margin-right: auto;}
.timeline .timeline-item::before { border-left: #E3E2E9 dotted 2px; content: ""; height: 86.5%; left: 16px; position: absolute; top: 50px; width: 2px;}

.timeline-icon{z-index: 1; position: absolute; left: 5px; top: 45px;}
.timeline-icon i.web-home{ font-size: 24px; }

.timeline-icon.bottom-icon{ top: auto; bottom: 7.5%; }
.timeline-icon.bottom-icon:before{ background: #89C930; height: 20px; width: 20px; z-index: -1; top: 5px; left: 2px; border-radius: 100%; position: absolute; content: "";}
.timeline-icon.bottom-icon i.web-home{ font-size: 10px; margin-left: 7px; margin-top: 1px; }
.timeline-icon.bottom-icon i.web-home:before{ color: #ffffff; }

.timeline-card-header{ display: block; font-size: 15px; margin-bottom: 25px;}
.timeline-card-header .progress-percent{ max-width: 100px; }
.timeline-card-header .timeline-card-title{  font-family: 'Circular Std Medium'; font-size: 15px; }
.timeline-card-header .timeline-sub-title{ display: block; padding: 5px 0; color: #4D4D4D; }

.timeline-card .progress-area i{ font-size: 20px; margin-right: 0; vertical-align: middle; max-width: 10px; }
.timeline-card .progress-percent .progress{ height: 10px; border-radius: 50px; min-width: 100%;}
.timeline-card .progress-area .progress-value{ font-size: 14px; font-family: 'Circular Std Medium'; /*position: absolute; right: 0; top: 50%; transform: translateY(-50%);*/}

.timeline-card-body{ position: relative; display: block; margin-bottom: 15px; }
.car-miles{ display: block; font-size: 14px; margin-bottom: 12px;}
.timeline-content{ border: #E3E2E9 solid 1px; padding: 15px 15px 10px 15px; border-radius: 15px; position: relative; min-height: 100px; }
.timeline-content .progress-percent{max-width: 60%;}
.card-dropdown .card-title{
    margin-bottom: 0 !important;
    border: none !important;
    cursor: pointer;
}
.w-115{
    max-width: 115.3px !important;
}
.timeline-content .w-115 .progress-percent{
    max-width: 58%;
}
.card-drop-down-title{
    cursor: pointer;
}
.card-dropdown{
    display: none;
    border: 1px solid #E3E2E9;
    border-radius: 10px;
    width: 100%;
    background: white;
    z-index: 2;
}
.timeline-checkbox{ position: absolute; left: -30px; }
.timeline-checkbox.form-check .form-check-input[type=checkbox] { height: 20px; width: 20px; border-radius: 100%; background-color: #fff; border-color: #E3E2E9; cursor: pointer;}
.timeline-checkbox.form-check .form-check-input:checked[type=checkbox]:before{ font-size: 10px; top: 3px; color: #89C930; }
.timeline-checkbox.form-check .form-check-input:focus{ box-shadow: none; }

.timeline-content time{ font-size: 14px; font-family: 'Circular Std Medium'; display: block;text-align: right; position: relative; margin-bottom: 8px;}
.timeline-content time .web-petrol-pump{ position: absolute; left: 0; top: 50%; transform: translateY(-50%); font-size: 12px; margin-top:-1.5px; }
.timeline-content .web-power-petrol-pump{ font-size: 18px; margin-right: 10px; }
.timeline-content .search-location{font-family: 'Circular Std Medium'; font-size: 14px; margin-bottom: 8px;}
.timeline-content .search-location i{
    font-size: 18px;
}
.timeline-content .address-area{ color: #4D4D4D;font-size: 13px; line-height: 18px; margin-bottom: 5px; }
.timeline-content .form-select{ padding: 2px 12px 0px 3px; font-size: 10.5px; background-position: right .2rem center; background-size: 9px 9px; }

.campare{ display: inline-block; vertical-align: middle; text-align: center; line-height: 1px; padding: 0 10px;}
.campare i{ font-size: 10px;}
.timeline-content .progress-area{ display: inline-block; width: 100%; max-width:42.5%; vertical-align: middle;  margin-right: -3px; margin-bottom: 0; margin-top: 0; line-height: 1; }

.update-revert{ position: relative; }
.update-revert .revert{ font-size: 15px; color: #89C930; line-height: 14px; }
.update-revert .revert i{ vertical-align: bottom; font-size: 18px; margin-right: 10px; }
.update-revert .btn.btn-primary{ background: #89C930; border-color: #89C930; font-size: 15px; display: block; padding: 10px 30px; margin: 0px 0 0px auto; }

.map-trip-area{ padding-top: 80px; position: relative;  border-radius: 0px 0px 0px 0px; height: 100vh;  overflow: hidden;}
/*.map-trip-area{ padding-top: 90px; position: relative;  border-radius: 0px 20px 20px 0px; height:100vh;}*/
.map-trip-area img{ width: 100%; height: 100%; top: 0; z-index: 0; background-attachment: fixed;}
.map-trip-area iframe{ height: 100%; top: 0; z-index: 0;}

@media (max-width: 768px) { 

.map-trip-area { height: 50vh !important; padding-top: 60px !important; }
.sidebar { height: 100% !important; margin-top: 0px !important; }
.sidebar_content { overflow-y: visible !important; }

}

.popup-btn{ margin: 20px auto 20px auto;}

/*.modal{ z-index: 1050; }*/
.modal{ z-index: 9999; }
.modal-dialog{ max-width: 925px;}
.modal-dialog.large-width{ max-width: 1225px;}
.modal-content{background: #FFFFFF; box-shadow: 0px 12px 45px rgba(0, 0, 0, 0.09); border-radius: 20px; border: none; padding: 30px 40px 40px 40px; display: inherit;}
.modal-content.paddLarge{ padding: 40px 150px; }
.modal-body{ padding: 0; }
.modal-header{border-bottom: none; border: none; padding: 0; position: relative; display: inherit; text-align: center;}
.modal-header .btn-close{ background: none; margin: 0; position: absolute; right: 0; top: 0; padding: 0; opacity: 1; width: 25px; height: 25px; }
.modal-header .btn-close:focus{ box-shadow: none; }
.modal-header .btn-close:hover .web-close-btn:before{ color:#89C930 ; }
.modal-header .modal-title{ padding: 50px 0; font-family: 'Circular Std Medium'; }
.modal-header .modal-title i{ display: block; font-size: 45px; margin-bottom: 10px; }

.select-box-area{ position: relative; margin-bottom: 10px; margin-top: 30px;}
.select-box-area label{ color: #B7B5C2; font-size: 15px; position: absolute; top: -30px;}
.select-box-area .form-select{ font-size: 15px; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 10px; padding: 15px 15px 15px 40px;}
.select-box-area i{ position: absolute; left: 15px; top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%); }
.select-box-area i.web-volkswagen{ font-size: 24px; }
.select-box-area.input-area .form-control{ padding-left: 40px; position: relative; }
/*.select-box-area.input-area:before{  content: "\e91e"; font-family: 'ecotally'; position: absolute; right: 15px; font-size: 7px; z-index: 1; top: 50%;}*/
.select-box-area.pdd-left-less .form-select{ padding-left: 15px; }

.button-area{  margin-top: 70px;  border: none; padding: 0; }
.button-area .btn{ margin: 0; }
.button-area .btn.btn-primary{ margin: 0 0 0 auto; display:block; max-width: 110px; width: 100%; background: #89C930; }
.button-area .btn.btn-primary:hover{ background: #000000; }
.button-area .skip{ color: #9B98AD;font-size: 15px; text-decoration: none; }
.button-area .skip i:before{ color: #9B98AD; margin-right: 10px; }


.top-box-head{ display: block; min-height: 25px; margin-bottom: 5px; color: #B7B5C2; font-size: 12px; text-transform: uppercase; text-align: center;}
.phone-box-area.form-check{ margin-bottom: 0; cursor: pointer; display: block; position: relative; padding: 0; background: #FFFFFF; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 10px; text-align: center; max-width: 205px; width: 100%; margin: 0 auto;}
.phone-box-area.form-check .form-check-input[type=radio]{height: 16px; width: 16px; border-radius: 100%; margin-left:15px; margin-top: 15px; }
.phone-box-area.form-check .form-check-input:checked[type=radio]{background: none; background-color: #89C930; border-color: #89C930; position: relative;}
.phone-box-area.form-check .form-check-input:checked[type=radio]:before{content: "\e912";  color: #fff; font-family: 'ecotally'; position: absolute; left: 0; right: 0 ; top: 2px; font-size: 7px; margin: 0 auto; text-align: center;}
.phone-box-area.form-check i{ font-size: 50px; padding: 20px 0; display: block; text-align: center; }
.phone-box-area.form-check i.web-others{ font-size: 16px; padding: 40px 0 30px 0; }
.phone-box-area.form-check.border-active{ border: 1px solid #89c930; /*top: 0; left: 0; bottom: 0; right: 0; position: absolute; content: ""; border-radius: 10px;*/}
.phone-box-area.form-check .form-check-label{ display: block; min-height: 120px; padding: 15px; cursor: pointer;}
.max-width.modal-body{max-width: 650px; width: 100%;margin: 0 auto;}

.phone-box-area.form-check p{ min-height: 120px; color:#696777; padding: 15px 0; display: block; text-align: center; font-size: 15px; line-height: 22px; margin-bottom: 0;}

.phone-box-area.form-check .wifi-service{ position: relative; padding-top: 20px; padding-bottom: 10px; line-height: 16px; min-height: 85px;}
.phone-box-area.form-check .wifi-service i{ font-size: 20px; padding: 0; color: #89C930; margin-bottom: 10px;}
.phone-box-area.form-check .wifi-service i.yellow-color:before{ color: #FFD700; }
.phone-box-area.form-check .wifi-service i.orange-color:before{ color: #F1B04D; }
.phone-box-area.form-check .wifi-service i.lightgreen-color:before{ color: #9ED970;}
.phone-box-area.form-check .wifi-service span{ font-size: 14px; line-height: 16px; color: #000000;}
.max-width-large.modal-body{max-width: 1024px; width: 100%;margin: 0 auto;}
.max-width-medium.modal-body{max-width: 925px; width: 100%;margin: 0 auto;}

.box-content-area{background: #FFFFFF; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 5px; display: block; padding: 20px;}
.box-content-area h5{ font-size: 15px; color: #000000; margin-bottom: 15px; }
.box-content-area p{font-size: 12px; line-height: 16px; color: #9B98AD;}



.stepwizard-step {position: relative;}
.stepwizard-step p { margin-top: 10px; line-height: 22px; padding: 0; margin: 0;}
.stepwizard-step button[disabled] { opacity: 1 !important; filter: alpha(opacity=100) !important;}
.default-step{ position: relative; padding: 10px 0px 15px 0px; font-size: 18px; line-height: 23px; color: #000000; text-decoration: none; width: 100%; display: block; font-family: 'Circular Std Medium';  }
.default-step:hover{ color: #000000; }
.default-step:before{ height: 6px; width: 100%; position: absolute; bottom: 0; left: 0; right: 0; background-color: #EAEAEA; content: "";}
.default-step.active-step:before{background-color: #89C930;}

/*** ian for step progress bars ***/
.isDisabled > a {
    color: currentColor;
    display: inline-block;  /* For IE11/ MS Edge bug */
    pointer-events: none;
    text-decoration: none;
}
.isDisabled {
    cursor: default;
}

.stepwizard-step:nth-child(1) .default-step:before{ margin-right: 0; }
.stepwizard-step:nth-child(2) .default-step:before{ margin-left: 0; }

.acount-title{ display: block; padding: 0px 0 40px 0; text-align: center; }
.acount-title i{ font-size: 50px; margin-bottom: 10px; }
.acount-title p{font-size: 20px; color: #000000; font-family: 'Circular Std Medium'; margin-bottom: 0; }

.input-group-lg .input-group-text i{ color: #89C930; font-size: 16px; }

.form-group .web-eye{ position: absolute; z-index: 9; right: 15px; top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%);  }
.nextBtn.btn{ width: 100%; background: #89C930; border-radius: 6px; padding: 20px 30px; }


.wizard-form-area{ position: relative; padding: 80px 0 0px 0; }
.wizard-form-area .mazWidth{ max-width: 926px; margin: 0 auto; }

.browse-file{background: #FAFFFA; border: 2px dashed #89C930; box-sizing: border-box; border-radius: 5px; padding: 30px 0 30px 0; text-align: center;}
.browse-file .default-heading{ display: block; padding: 20px 0px 100px 0px; }
.custom-file-input{ position: relative;  margin-top: 20px; }
.custom-file-input .form-control{ z-index: -1; opacity: 0;position: absolute; padding: 10px 10px; }
.form-group label.label-group-text{ position: relative; top:0;  bottom: 0; line-height: 24px; background: #FFFFFF; padding: 10px 20px;
border: 1px solid #89C930; box-sizing: border-box; border-radius: 0px 20px 0px 20px !important; color: #89C930;}

.number{ width: 32px; height: 32px; background: #89C930; border-radius: 0px 10px 0px 10px; color: #ffffff; text-align: center; padding: 5px; position: absolute; left: 0; top:50%;-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%); }
.list-group{ padding-left: 20px; position: relative; }
.list-group .list-group-item{ border: none; background: none; position: relative;  font-size: 15px; line-height: 20px; margin-bottom: 5px; color: #9B98AD; padding-left: 40px;}
.list-group:before{ position: absolute; height: 95%; top: 5px; left: 35px; bottom: 0; border-left: #89C930 dotted 1px; content: ""; }
.list-group .list-group-item a{ color: #89C930; }
.list-group .list-group-item a i{ font-size: 12px; }

.back-btn{ position: absolute; top: 0; left: 0; font-size: 14px; color: #c4c4c4; background: none; border: none; padding: 0; margin: 0; text-transform: uppercase; }
.back-btn i{ margin-right: 5px; top: -2px; position: relative; }




.top-heading{ margin-bottom: 50px; }

.location-area{ position: relative; margin-bottom: 50px; }
.location-area.mar-botm-none{ margin-bottom: 0; }
.location-area .box-Title{font-size: 18px; font-family: 'Circular Std Medium';}
.location-area .box-Title .web-charging-available{ position: relative; margin-left: 3px; margin-top: -12px; font-size: 12px; cursor: pointer;}
.location-area .box-Title .web-charging-available span{ position: relative; }
.location-area .box-Title .web-charging-available:before{ width: 18px; height: 18px; background-color: #89C930; border-radius: 100px; position: absolute; right: -3px; top: -4px; content: ""; }
.location-area.paddright{ padding-right: 50px; }
.location-area:last-child{ margin-bottom: 20px; }

.location-area .default-heading{ margin-bottom: 10px;}
/*.location-area .default-heading h3{ font-size: 24px; }*/
.location-area .default-heading h3 i{ font-size: 30px; }
.location-area .default-heading h5{ font-size: 18px; }
.location-area .default-heading.hightlight{ background-color: yellow; padding: 5px;}

.location-area .form-check{ min-height: 24px; padding-left: 1.5em; }
.location-area .form-check .form-check-input{width: 24px; height: 24px; margin-left: 0;}
.location-area .form-check-input:checked[type=checkbox]:before{font-size: 12px; top: 3px;}



.map-location{ padding-bottom: 3px; /*border-bottom:#E3E2E9 solid 1px;*/ margin-bottom: 15px; font-size: 15px; position: relative;}
.map-location.white-bg:before{ position: absolute; top: 0; bottom: 0; height: 30px; width: 30%; right: 0; background-color: #ffffff; content: ""; }
.map-location i{ vertical-align: middle; font-size: 22px; }
.delate-area{ text-align: right; }
.delate-area .text-right{text-align: right;}
.delate-area i{ font-size: 20px; margin-right: 0; }

.po-absolute{ position: absolute; right: 0; top: 0;  width: auto;}
.map-location.heading{
    margin: 0;
    padding: 8px;
    background: #FFFFFF;
    border: 1px solid #E3E2E9;
    box-sizing: border-box;
    border-radius: 5px;
}
.map-location.heading h3{
    margin: 0;
    padding: 0;
    font-size: 20px;
}
.map-location.heading h3 input{
    font-size: 20px;
}
.map-location .form-control,
.hours-number .form-control{ display: inline-block; border: none; padding: 0px 0px; display: inline-block; max-width: 92%; font-size: 14px; /*left: 3px;*/ position: relative;}
.hours-number .form-control{ margin: 0px auto 0 auto; display: block; text-align: center; background: none;}
.hours-number input[type=number]::-webkit-inner-spin-button { background: url('../images/double-arrow.svg') no-repeat 50% 50%; width: 7px; height: 7px; padding:4px 0px;}

.map-location-area{ display: block; position: relative; filter: drop-shadow(0px 12px 16px rgba(0, 0, 0, 0.03));
border-radius: 0px 0px 5px 5px;}
.map-location-area img.map-img{ border: 1px solid #E3E2E9; box-sizing: border-box; filter: drop-shadow(0px 12px 16px rgba(0, 0, 0, 0.03)); border-radius: 5px;}
.show-restore-btn .btn{ background: #89C930; padding: 12px 15px 10px 15px; }
.show-restore-btn .btn:hover{ background-color: #000000; }
.show-restore-btn .btn:hover .web-restore .path3:before{ color: #000000; }
.show-restore-btn .btn i{ font-size: 20px; position: relative; top: -3px; margin-right: 5px; /*vertical-align: sub;*/}
.show-restore-btn .btn i.web-delete-btn .path4:before{color: #ffffff;}
.show-restore-btn .btn i.web-trash_remove_delete_icon:before,
.show-restore-btn .btn i.web-delete_remove_restore_trash_undo_icon:before{color: #ffffff;}

.show-restore-btn .btn:hover .web-delete-btn span.path3,
.show-restore-btn .btn:hover .web-delete-btn .path2:before{ display: none; }

.show-restore-btn .btn:hover .web-delete-btn .path1:before,
.show-restore-btn .btn:hover .web-delete-btn .path4:before,
.show-restore-btn .btn:hover .web-delete-btn .path5:before,
.show-restore-btn .btn:hover .web-delete-btn .path6:before,
.show-restore-btn .btn:hover .web-delete-btn .path7:before
.show-restore-btn .btn:hover .web-trash_remove_delete_icon:before,
.show-restore-btn .btn:hover  .web-delete_remove_restore_trash_undo_icon:before{color: #ffffff;}



/*.show-restore-btn .btn i.web-plus:before, .add-trip.btn i.web-plus:before{ display: none; }*/
.show-restore-btn .btn i.web-plus, .add-trip.btn i.web-plus{color: #ffffff; line-height: 16px; font-size: 15px; top: -2px; position: relative; }
.show-restore-btn .btn i.web-plus:before, .add-trip.btn i.web-plus:before{color: #ffffff;}

.add-trip.btn{background: #89C930;}
.add-trip.btn:hover{ background-color: #000000; }


.placeName.form-group label{ color: #000000; font-size: 18px; font-weight: 500; font-family: 'Circular Std Medium';}
.placeName .input-group-lg >.form-control{ padding: 8px 10px; font-family: 'Circular Std Medium'; background: #FFFFFF;  box-sizing: border-box; border-radius: 5px;}
.placeName .input-group-lg .input-group-text{ border-radius:5px 0px 0px 5px; padding: 5px 5px 5px 10px; }
.placeName .input-group{flex-wrap: inherit;}

.box-Title.dropup .dropdown-toggle::after{ display: none; }


.chargingBox{ display: block; position: relative; cursor: pointer; background: #FFFFFF; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 5px; padding: 10px; text-align: center; min-height: 90px; }
.chargingBox:hover,
.chargingBox.active{ border: 1px solid #89C930; box-shadow: 0px 10px 11px -1px rgba(65, 178, 73, 0.12);}
.chargingBox i{ font-size: 24px; margin-bottom: 10px; }
.chargingBox p{ margin-bottom: 0; color: #9B98AD; font-size: 14px; line-height: 16px; }

.chargingBox.form-check{ min-height: 90px; padding-left:10px; }
.chargingBox.form-check .form-check-input{width: 100%; height: 100%; margin-left: 0; border: none; background: none; min-height: 90px; position: absolute; left: 0; top: 0; bottom: 0; right: 0;}
.chargingBox.form-check .form-check-input:checked[type=checkbox]:before{ display: none; }
.chargingBox.form-check .form-check-input:checked[type=checkbox]:after{position: absolute; left: 0; top: 0; bottom: 0; right: 0; border-radius: 5px; border: 1px solid #89C930; box-shadow: 0px 10px 11px -1px rgba(65, 178, 73, 0.12);}
.chargingBox.form-check .form-check-input:checked[type=checkbox]{ background: none; border-radius: 5px; border: 1px solid #89C930; box-shadow: 0px 10px 11px -1px rgba(65, 178, 73, 0.12);}
.chargingBox.form-check .form-check-input:checked[type=radio]:before{ display: none; }
.chargingBox.form-check .form-check-input:checked[type=radio]:after{position: absolute; left: 0; top: 0; bottom: 0; right: 0; border-radius: 5px; border: 1px solid #89C930; box-shadow: 0px 10px 11px -1px rgba(65, 178, 73, 0.12);}
.chargingBox.form-check .form-check-input:checked[type=radio]{ background: none; border-radius: 5px; border: 1px solid #89C930; box-shadow: 0px 10px 11px -1px rgba(65, 178, 73, 0.12);}


.office-home-work{ position: relative; display: block; padding:30px 25px 10px 25px; background: #FFFFFF; border: 1px solid #E3E2E9; box-sizing: border-box;
border-radius: 5px;}
.office-home-work i{ font-size: 24px; margin-right: 10px; }
.office-home-work h5{font-family: 'Circular Std Medium'; display: block; padding: 10px 0;}
.office-home-work p{font-size: 15px; line-height: 19px; color: #9B98AD;}


.map-location-area .map-location{ z-index: 1; position: absolute; left: 0; right: 0; top: 0; margin: 0; padding: 8px ; background: #FFFFFF; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 5px; }
.map-location-area .map-location.po-relative{ position: relative; }

.hourlist{ margin-top: 20px; position: relative; }
.hourlist.mrtop{ margin-top: 0; }
.hourlist .box-Title{ margin-bottom: 10px;}
.hours-number{background: #FFFFFF; width: 44px; height: 44px; padding: 5px; margin-right: -1px; display: inline-block; vertical-align: middle; border: 1px solid #E3E2E9; box-sizing: border-box; border-radius: 5px; text-align: center;}
.hours-number .weekend-name{ color: #9B98AD; display: block; font-size: 12px; line-height: 15px; }
.hours-number span{ font-size:14px; /*color: #093C6A;*/ color: #000000; display: block; }

.hour-list-area{ position: relative; }
.hours{ position: absolute; right: -10%; top:70%; -webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-o-transform:translateY(-50%);transform:translateY(-50%); }
.hours p{ margin-bottom: 0; color: #9A97AC; font-size: 12px; line-height: 15px; }

.hourlist .form-group .form-control{
    padding: 10px 0 10px 16px !important;
    text-align: center;
    display: inline-block;
    width: 50%;
    text-align: center !important;
}
.hourlist .form-group label{ min-height: inherit;  color: #4D4D4D;}
.hourlist .form-group span{
    position: relative;
    display: inline-block;
    font-size: 12px;
    line-height: 2;
    margin-top: -2px;
    color: #093C6A;
    vertical-align: middle;
    padding-left: 5px;

}


.hourlist .form-group .form-control.form-select{ background: url(../images/double-arrow.svg); background-repeat: no-repeat; background-size: 14px 42px; background-position-x: 90%;}

.box-Title .dropdown-menu {position: relative; width: 100%; min-width: 400px; max-width: 400px; padding: 20px; margin-left: -20px !important; background: #FFFFFF; border: 1px solid #E1E0E7; box-shadow: 0px 18px 33px rgba(0, 0, 0, 0.08); border-radius: 5px;}
.box-Title.dropup .web-charging-available:hover + .dropdown-menu{ display: block; position: absolute; top: 100%; margin-left: -20px !important;}
.box-Title .dropdown-menu.office-home-work-in .office-home-work{ padding: 25px 0 0 0; border: none; }

/*.box-Title .dropdown-menu.minwidth{ max-width: 630px; min-width: 630px; }*/
.box-Title .dropdown-menu:after{top: 100%; left: 27px; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(136, 183, 213, 0); border-top-color: #ffffff; border-width: 5px;}
.box-Title .dropdown-menu li{font-size: 12px; line-height: 15px; padding: 5px 0;}
.box-Title .dropdown-menu li i{ font-size: 24px; margin-right: 10px; }
.box-Title .dropdown-menu li h6{ display: inline-block; font-family: 'Circular Std Medium';}
.box-Title .dropdown-menu li a.dropdown-item{ padding: 0; }
.box-Title .dropdown-menu li .first-row{ color: #9B98AD; }
.box-Title .dropdown-menu li .first-row i{ font-size: 14px; }
.box-Title .dropdown-menu li p{color: #093C6A; margin-bottom: 0; font-size: 12px; line-height: 15px; text-align: center;  font-family: 'Circular Std Medium';}
.box-Title .dropdown-menu li p strong{ color: #000000; }
.dropdown-divider{ border-top: 1px solid #E6E4ED; }

.box-Title .dropdown-menu .office-home-work{ border: none;  border-radius: 0; padding: 25px 0 0 0;  /*border-left: 1px solid #E3E2E9;*/}
.box-Title .dropdown-menu .office-home-work h5{ font-size: 18px; display: inline-block; }
.box-Title .dropdown-menu .tipical-list{ padding: 20px 20px 20px 20px; }


.vehicles-trip-head{ z-index: 999; background-color: #ffffff; }
.sidebar .footer-area{ position: relative; border-radius: 0px 30px 0px 0px; margin-top: 25px;padding-bottom: 15px}
.sidebar .footer-area .default-heading{ padding: 5px 20px 0px 15px; }
.sidebar .footer-area .default-heading h2{ font-size: 16px; }
.sidebar .footer-area .footer-col{  padding: 10px; width: auto; max-width: inherit; }
.sidebar .footer-area .footer-col h5{ margin-bottom: 0; font-size: 16px; }
.sidebar .footer-area ul li{ line-height: 13px; }
.sidebar .footer-area ul li a{ font-size: 14px; }
.sidebar .footer-area .footer-logo img{ max-width: 120px; }
.sidebar .footer-area .Copyright{ padding: 7px 10px 4px 10px; }
.sidebar .footer-area .Copyright p, .sidebar .footer-area .Copyright ul{font-size: 14px; line-height: 16px; text-align: center; }

/*mapbox ian 2/15/2024 */
[class*="--Results"] { z-index: 10000 !important; }
[class*="--Results"] { z-index: 10000 !important; }
[class*="--SearchIcon"] { display: none; }
[class*="--ClearBtn"] { display: none !important; }
[class*="--Input"] { padding: 0px 5px !important; box-shadow: none !important; border-width: 0px !important; }
[class*="--MinimapAttribution"] { padding: 0px 5px !important; box-shadow: none !important; border-width: 0px !important; display: none !important; }
[class*="--MinimapMarker"] svg { fill: #696777 !important; }

/* TomTom */
.mapboxgl-ctrl-attrib { display: none !important; } 
/*.mapboxgl-control-container { display: none !important; } */
