﻿@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');


:root {
  --text-color: #333;
  --bg-color-2: #eee;
  --bg-color-1: #fff;
 --highlight-color: #373cc6;
}






body
{font-family: 'Roboto', sans-serif;font-size:13px;color:var(--text-color);
}
#main-map {position:fixed;width:100%;height:100%;z-index:1;object-fit:cover;
}
iframe .place-card {
display:none!important}
#header {
position:fixed;z-index:2;width:100%;top:0px;padding:20px 0px;}
#main-menu-link {
background:#fff;padding:7px;border-radius:3px;box-shadow:2px 2px 2px rgba(0,0,0,.1)}
#main-menu-link img {
width:16px;margin:0px;padding:0px;}
#left-menu-1 {
width:300px;height:100%;position:fixed;z-index:999;left:0px;top:0px;background:#fff;transform:translateX(-300px);transition:all .3s ease-in;}
    #left-menu-1.active {transform:translateX(0px);
    }
#overlay {position:fixed;z-index:9;background:rgba(0,0,0,.3);width:100%;height:100%;left:0px;top:0px;transition:all .3s ease-in;opacity:0;visibility:hidden;
}
    #overlay.active {opacity:1;visibility:visible;
    }
.left-menu-header .logo-title {
font-size:18px;font-weight:700;}
    .left-menu-header .logo-title img {
    max-width:200px;max-height:45px;}
.left-menu-header {
padding:5px 0px;border-bottom:solid 1px rgba(0,0,0,.2);}
#hide-left-menu-link img {
    width: 15px;
    opacity: .6;
    top: 12px;
    position: relative;}
.left-menu-header h1 {
margin:0px;padding:0px;}
.left-menu-content ul {
margin:0px;padding:0px;list-style:none;}
.left-menu-content ul li a{display:block;font-size:14px;color:#444;padding:15px 10px;border-bottom:solid 1px rgba(0,0,0,.0);transition:all .3s linear;
}
    .left-menu-content ul li a img {width:17px;opacity:.7;margin-right:10px;
    }
    .left-menu-content ul li a:hover {
    background:var(--bg-color-2)!important;text-decoration:none;}
.header-right-menu {margin:0px;padding:0px;list-style:none;
}
    .header-right-menu li {
    float:left;margin:0px 10px;}
.header-right-menu li.searchicon a.open-search-link{width:30px;height:30px;border-radius:100%;background:#fff;box-shadow:1px 1px 1px rgba(0,0,0,.1);display:block;text-align:center;line-height:30px;
    }
        .header-right-menu li.searchicon a.open-search-link img {width:14px;
        }

.usericon {
position:relative;top:-4px;}
.usericon .dropdown-toggle img {
width:40px;height:40px;object-fit:cover;border-radius:100%;cursor:pointer;}
.usericon .dropdown-toggle:after {
display:none}
.customdropdown {
margin-top:10px;border:none;}
    .customdropdown .dropdown-item {
    font-size:13px;}
.header-search {
width:200px;background:#fff;box-shadow:1px 1px 1px rgba(0,0,0,.1);padding:3px 6px;border-radius:3px;position:absolute;transform:translateX(-210px);margin-top:-2px;opacity:0;visibility:hidden;transition:all .3s ease-in;}
    .header-search.active {opacity:1;visibility:visible;
    }
    .header-search input[type="text"] {
    width:100%;border:none;padding:4px;outline:none;}
.close-search-link img {
width:14px;position:relative;top:3px;}
#right-side-menu {
position:fixed;right:0px;top:100px;padding-right:28px;z-index:2;}

    .multidropdown ul {
    margin:0px;padding:0px;list-style:none;}
        .multidropdown ul li a.right-side-menu-item {width:25px;height:25px;background:#fff;display:block;text-align:center;line-height:25px;border-radius:3px;margin-bottom:10px;box-shadow:1px 1px 1px rgba(0,0,0,.1);transition:all .3s ease-in;
        }
            .multidropdown ul li a.right-side-menu-item:hover {box-shadow:5px 5px 5px rgba(0,0,0,.1);
            }
    .multidropdown ul li a.right-side-menu-item img{width:11px;
        }
    .multidropdown .dropdown ul{position:absolute;margin:0px;padding:0px;list-style:none;
width:150px;transform:translate(-150px);padding-right:10px;   margin-top:-50px; border-radius:3px;opacity:0;visibility:hidden;transition:all .3s ease-in;}

        .multidropdown .dropdown ul li strong {
        background:#373cc6;color:#fff;text-align:center;text-transform:uppercase;padding:10px;display:block}
    .multidropdown .dropdown ul li a {
        display:block;color:#666;border-bottom:solid 1px rgba(0,0,0,.1);padding:10px;background:#fff;}
        .multidropdownu .dropdown ul li a:hover {
        background:#eee;text-decoration:none;}
    .multidropdown li.dropdown:hover > ul{opacity:1;visibility:visible;
    }

    #left-side-menu {
position:fixed;left:0px;top:100px;padding-left:28px;z-index:2;}
   .multidropdown-left ul {
    margin:0px;padding:0px;list-style:none;}
        .multidropdown-left ul li a.right-side-menu-item {width:40px;height:40px;background:#fff;display:block;text-align:center;line-height:40px;border-radius:3px;margin-bottom:10px;box-shadow:1px 1px 1px rgba(0,0,0,.1);transition:all .3s ease-in;
        }
            .multidropdown-left ul li a.right-side-menu-item:hover {box-shadow:5px 5px 5px rgba(0,0,0,.1);
            }
    .multidropdown-left ul li a.right-side-menu-item img{width:14px;
        }
    .multidropdown-left .dropdown ul{position:absolute;margin:0px;padding:0px;list-style:none;
width:150px;transform:translate(50px);padding-right:10px;   margin-top:-50px; border-radius:3px;opacity:0;visibility:hidden;transition:all .3s ease-in;}

        .multidropdown-left .dropdown ul li strong {
        background:#373cc6;color:#fff;text-align:center;text-transform:uppercase;padding:10px;display:block}
    .multidropdown-left .dropdown ul li a {
        display:block;color:#666;border-bottom:solid 1px rgba(0,0,0,.1);padding:10px;background:#fff;}
        .multidropdown-left .dropdown ul li a:hover {
        background:#eee;text-decoration:none;}
    .multidropdown-left li.dropdown:hover > ul{opacity:1;visibility:visible;
    }
ul.status-bar {
margin:0px;padding:0px;list-style:none;margin-left:100px;}
ul.status-bar li{float:left;width:48px;height:48px;border-radius:100%;margin:0px 3px;text-align:center;padding-top:12px;color:#fff;}
    ul.status-bar li a {
    color:#fff;}
        ul.status-bar li a:hover {
        text-decoration:none;}
    ul.status-bar li span {    display:block;line-height:14px;font-size:14px;}
    ul.status-bar li span.small {font-size:10px;margin-top:1px;
    }
.all {background:#565656;}
.running {background:#0f7b3f;}
.stop {background:#e71c39;}
.idle {background:#dfb626;}
.inactive {background:#3d8bca;}
#top-links {position:fixed;z-index:3;top:0px;left:0px;width:100%;
}
    #top-links .toplinks-content {display:table;margin:auto;border-bottom-left-radius:3px;border-bottom-right-radius:3px;
    }
        #top-links .toplinks-content a {
        color:#fff;font-size:12px;display:inline-block;padding:4px 10px;border-right:solid 1px rgba(255,255,255,.4);background:#333;border:solid 1px #333}
            #top-links .toplinks-content a:hover {
            text-decoration:none;}





.vertical-nav {
  min-width: 350px;
  width: 350px;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.4s;z-index:99999;background:var(--bg-color-2);padding:5px;
}

.page-content {
  width: calc(100% - 350px);
  margin-left: 17rem;
  transition: all 0.4s;
}

/* for toggle behavior */

#sidebar.active {
  margin-left: -350px;
}

#content.active {
  width: 100%;
  margin: 0;
}


.sidebarbtn{position:absolute;z-index:9;top:90px;left:20px;}
.sidebarclosebtn {background: none;
    border: none;outline:none;box-shadow:none;
}

.sidebarclosebtn img{    opacity: .6;
    width: 12px;
    position: relative;
    top: 3px;}



.mytabs {
border:none;}
.mytabs .nav-link{font-size: 12px;
    padding: 5px 8px;border:none;border-radius:0px;color:#333;
}
.search-small {    border: solid 1px #e0e0e0;padding:3px 6px;
}
    .search-small input[type="text"] {width:100%;border:none;outline:none;
    }
    .search-small img {
    width:12px;opacity:.7}
.btn-refresh {
    border: none;
    background: #e4e4e4;
    padding: 5px;
    width: 100%;
    outline: none;}
.dot {
width:12px;height:12px;border-radius:100%;background:#eee;display:block;}
.dot-inactive {background:#373cc6;}

.vechicles-table  img {
width:12px;}
.vechicles-table {
font-size:11px;}
.vechicles-table p {
margin:0px;padding:0px;}
.table td, .table th {
vertical-align:middle;}


.dropdown-submenu {
    position: relative;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}
.mydropdown-small .dropdown-toggle::after {display:none;
}
.mydropdown-small .dropdown-menu {    transform: translate3d(26px, -8px, 0px)!important;
}
.choosecoloumndropdown .dropdown-menu{padding:0px;font-size:12px;
}
    .choosecoloumndropdown .dropdown-menu .dropdown-item {
    padding:0px;}
    .choosecoloumndropdown .dropdown-menu h3 {
    margin:0px;padding:0px;font-size:14px;text-align:center;color:#fff;background:#373cc6;padding:6px;}
.chooseitems {
padding:20px;}
    .chooseitems label {
    margin-bottom:0px;}











    .containerinput {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
.check, .radio{
  height: 15px;
  width: 15px;
  position: relative;overflow:hidden;-webkit-appearance: none;-moz-appearance:none;background:#eee;position: relative;
    top: 4px;
    margin-right: 8px;
}

.check:after, .radio:after{
  content: '\00D7';
  display: block;
  background: white;
  background-image: url('../images/checkmark.png');
  pointer-events: none;
  font-size: 15px;
  position: absolute;
  top: 0;
  left: 0;
  height: 15px;
  width: 15px;
  color: transparent;
  transition: .25s all ease-in-out;
  border-radius: 3px;
  line-height: 15px;
  background-position: 0 15px;
  background-repeat: no-repeat;
  background-size: 15px 15px;
  border-width: 2px;
  border-style: solid;
  border-color: transparent;overflow:hidden;background-color:#eee;background-size:12px;
}
.radio:after{ border-radius: 50%;overflow:hidden }
.check:checked:after, .radio:checked:after {
  background-color: #373cc6;
  background-position: 0 0;overflow:hidden
}
.check:hover:after, .radio:hover:after{
  border-color: #373cc6;overflow:hidden
}
.helper{
  color: #CCC;
  font-family: sans-serif;
  position: absolute;
  bottom: 0;
  display: block;
  width: 100%;
  text-align: center;overflow:hidden
}
.btn-small {
padding: 3px 9px!important;
    font-size: 10px!important;}
.btn {
border-radius:0px!important}
/*.bottom-bar {
position:fixed;bottom:0px;background:#eee;width:calc(100% - 350px);z-index:99;right:0px;opacity:0;visibility:hidden;transition:all .3s ease-in}*/
.bottom-bar {
position:fixed;bottom:0px;background:#eee;width:calc(100%);z-index:99;right:0px;opacity:0;visibility:hidden;transition:all .3s ease-in}
    .bottom-bar.active {
    visibility:visible;opacity:1}
        .bottom-bar.partial {
    width:calc(100% - 350px)}
.datatablebottom {
font-size:12px;margin-bottom:0px;}

    .datatablebottom img {
    width:12px;margin-right:6px;opacity:.6}
    .datatablebottom th, .datatablebottom td {
    padding:5px;color:#555;font-weight:400;}
.bottombtns .btn {
border-radius:3px!important;box-shadow:1px 1px 1px rgba(0,0,0,.1);margin-right:4px;}
.bottombtns .btn-default {
background:#fff;}
.bottombarclosebtn {    background: none;
    border: none;
    float: right;
}
.bottombarclosebtn img{    width: 14px;
    opacity: .5;
}
.sidebarbtn {border: none;
    background: #fff;
    width: 20px;
    height: 50px;
    box-shadow: 1px 1px 1px rgba(0,0,0,.1);
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    position: fixed;
    left: 0px;
}
    .sidebarbtn img {position: relative;
    left: -7px;
    }
.right-setting-bar {
position:fixed;width:250px;background-color: var(--bg-color-1)!important;right:0px;top:0px;z-index:9;height:100vh;padding:20px;color: var(--text-color)!important;transform:translate(250px);transition:all .3s ease-in;z-index:9999}
    .right-setting-bar.active {
    transform:translate(0px)}
.settings-items label{color: var(--text-color)!important;
}
.setting-header {font-size:18px;padding:10px 0px;border-bottom:solid 1px rgba(255,255,255,.2);margin-bottom:30px;}
    .setting-header img {    filter: invert(0);
    opacity: .5;cursor:pointer;float:right;width:15px;position:relative;top:4px;
    }
.setting-header {
}

.tabledropdown ul ul{transform: translateX(26px)!important;
}

.tabledropdown ul ul ul{
transform: translateX(144px)!important;}
.tabledropdown a {
text-align:left!important;text-decoration:none!important}
    .tabledropdown a img {
    margin-right:10px;opacity:.6}
    .tabledropdown a:hover {
    background:#eee!important;}
.history-form .form-group {
margin-bottom:4px!important;}
.history-form {
font-size:12px;}
.history-form select {width: 100%;
    border: solid 1px #ecebeb;
    padding: 3px;
    border-radius: 3px;
    }
    .history-form label {
    top:3px;}
    .history-form .btn-default {
    font-size:12px;border:solid 1px #ccc;background:#eee;border:none;color:#666}
.tablehistory {
font-size:11px}
    .tablehistory th, .tablehistory td {
    padding:5px;color:#666;}
    .tablehistory img {
    width:11px;}


.tabledropdown .dropdown ul{    left: -171px;
                                z-index:9999;
    box-shadow: 0px 0px 20px rgba(0,0,0,.1);
    background: #fff;
    margin-top: -14px;}
    .tabledropdown .dropdown ul ul{background: #fff;z-index: 9999;transform: translateX(30px)!important;}

    .chlid{overflow-y:scroll; }



  ::-webkit-scrollbar-track
{

	background-color: #efefef;
}

::-webkit-scrollbar
{
	width: 4px;
	background-color: #ccc;
}

::-webkit-scrollbar-thumb
{
	background-color: #ccc;
	border: 0px solid #555555;
}


/*NEW CSS DATE 12 JULY*/

.hoverpanel-block {  position: absolute;
    background: #fff;
    width: 100%;
    left: 350px;
    /* border: solid 1px #ccc; */
    /* margin-top: 30px; */
    z-index: 999;
    margin: 4px;
  
    /* margin-top: 23px; */
    box-shadow: 0px 0px 20px rgba(0,0,0,.2);transition:all .3s ease;opacity:0;visibility:hidden
}

.hoverpanel:hover .hoverpanel-block {opacity:1;visibility:visible
}
.hoverpanel-block-header {
font-size:15px;border-bottom:solid 1px #ccc;}
    .hoverpanel-block-header img {
    width:26px;}
.history-show-bar {
position:fixed;z-index:99999;    background: #fff;    box-shadow: 1px 1px 1px rgba(0,0,0,.1);    left: 365px;display:none;
    top: 19px;}
    .history-show-bar a {
    display:inline-block;padding:8px;border-right:solid 1px #eee;}
        .history-show-bar a img {
        width:15px;    opacity: .6;}
    .history-show-bar.active {
    display:block}
.form-control {    height: 30px;
    font-size: 13px;
}


/*NEW CSS DATE 18 JULY*/

.place-table {
font-size:12px;}
    .place-table small {
    display:inline-block;margin-left:10px;}
.place-btns a{display: inline-block;
    /* border: solid 1px #ccc; */
    margin-left: 4px;
    padding: 3px 5px;
}
    .place-btns a img {
  width: 12px;
    opacity: .7;}
#history-details-box {    position: fixed;
    right: 30px;
    bottom: 30px;
    z-index: 9999;
    background: #fff;
    width: 500px;
    padding: 10px;
    font-size: 12px;box-shadow: 1px 1px 1px rgba(0,0,0,.1);
}
    #history-details-box .table {
    margin-bottom:0px;}
.closehistorybox {display: block;
    width: 30px;
    height: 30px;
    float: right;
    position: absolute;
    background: #fff;
    margin-top: -36px;
    right: 0px;
    text-align: center;
    line-height: 29px;
}
    .closehistorybox img {    width: 12px;
    }
.overflowcontainer {
overflow-y:scroll;max-height:90vh;}
.font11 {
font-size:11px;}
#div_vehiclelist {    overflow-y: scroll;
    max-height: 100vh;padding-bottom:300px;
}
.page-area {
margin: 70px 0px 60px 0px;
    background: #fff;
    padding: 20px;
    padding-right: 100px;
    padding-left:100px;
    box-shadow: 0px 0px 20px rgba(0,0,0,.05);min-height:90vh;}
.main-heading {
font-size:22px;font-weight:400;position:relative;margin-bottom:20px;}
    .main-heading:after {content:"";width:70px;height:1px;background:#333;float:left;position:absolute;left:0px;bottom:-10px;
    }
.colordots {
display:table;margin:auto}
.dot {
width:10px;height:10px;border-radius:100%;display:inline-block;margin-right:8px;margin-left:8px;}
.yellow {
background:#e7d00c;}
.green {
background:#298f2d;}
.red {
background:#ff0b0b;}
.black {
background:#222;}
.pageicons a {
display:inline-block;padding:7px;}
    .pageicons a img {
    width:15px;opacity:.6}
.widgets-header label{margin-right:10px;
}



/*NEW CSS DATE 29 JULY*/

.pagearea2 {    max-height: calc(100vh )!important;
    overflow-y: scroll;padding:0px;margin: 0px;
}
.mainmaptwo { height: calc(100vh )!important;
}
.controlheader {padding:10px;
}
.choosecoloumndropdown .dropdown-menu {left: -190px!important;
}

.toplinkswhite label{color: #fff;}
.toplinkswhite img{filter:invert(1)!important;opacity: 1!important;
}

.colordots{
    position: relative;    top: 4px;
    margin: 0px 20px;}

/*THEME STYLE*/

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{background-color: var(--bg-color-1)}
.bg-white {
    background-color: var(--bg-color-1)!important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color:  var(--bg-color-2)!important;
}
.hoverpanel-block{background-color: var(--bg-color-1)!important;}
#history-details-box{background-color: var(--bg-color-1)!important;}
.multidropdown ul li a.right-side-menu-item{background-color: var(--bg-color-1)!important;}
#main-menu-link{background-color: var(--bg-color-1)!important;}
.multidropdown .dropdown ul li strong{background-color: var(--highlight-color)!important;}
.multidropdown .dropdown ul li a{background-color: var(--bg-color-1)!important;}
.header-search{background-color: var(--bg-color-1)!important;}
body{color: var(--text-color)!important;}
.table{color: var(--text-color)!important;}
.mytabs .nav-link{color: var(--text-color)!important;}
.tablehistory th, .tablehistory td{color: var(--text-color)!important;}
.bottom-bar{background-color: var(--bg-color-2)!important;}
.datatablebottom th, .datatablebottom td{color: var(--text-color)!important;}
.btn-primary{background: var(--highlight-color)!important;border:solid 1px var(--highlight-color)!important;}
.bg-primary{background: var(--highlight-color)!important;border:solid 1px var(--highlight-color)!important;}
.dot-inactive{background: var(--highlight-color)!important;}
#left-menu-1{background-color: var(--bg-color-1)!important;}
.left-menu-content ul li a{color: var(--text-color)!important;}
.multidropdown .dropdown ul li a{color: var(--text-color)!important;}
.dropdown-menu{background-color: var(--bg-color-1)!important;}
.choosecoloumndropdown .dropdown-menu h3{background-color: var(--highlight-color)!important;}
.dropdown-item{color: var(--text-color)!important;}
.btn-outline-primary{    color:var(--highlight-color)!important;;
    border-color:var(--highlight-color)!important;}

.pcr-app{position:absolute!important;left:auto!important;top:65px!important}

.choosecolor{width:30px;height: 30px;border-radius:100%!important;}
.modal-content{background-color: var(--bg-color-1)!important;}

.lighticon img[src*="icon"] {
    filter: invert(1)!important;
}
.table-bordered td, .table-bordered th{border: solid 1px var(--bg-color-2)!important;}
.closehistorybox{background-color: var(--bg-color-1)!important;}


#themechange-popup {
background:#fff;width:550px;height:550px;position:fixed;left:50%;top:50%;margin-top:-275px;margin-left:-275px;box-shadow:0px 0px 30px rgba(0,0,0,.2);z-index:99999999999;padding:30px;display:none;}
    #themechange-popup.active {
    display:block;}
.pickr .pcr-button {    display: table;
    margin: auto;border:solid 1px #999;
}

#themechange-popup{
color:#333!important}

    #themechange-popup h2 {
    font-size:22px;border-bottom:solid 1px #eee;padding-bottom:20px;margin-bottom:30px;}
    #themechange-popup h5 {
    background:#eee;padding:10px;margin:30px 0px;font-size:14px;}
#close-theme-change {
position:absolute;right:20px;top:20px;}
#themechange-popup img[src*="icon"] {
    filter: invert(0)!important;
}
.custom-control-label::before{top:1px;}
.custom-control-label::after{top:1px;}
.leftmenup #main-map{height:calc(100% - 60px);top:60px;}
.leftmenup #header{top:60px;}
.leftmenup #top-links{top:60px;}
.leftmenup .sidebarbtn{top:150px;}
.leftmenup #right-side-menu{top:160px;}
.leftmenup #left-menu-1{width: 100%;    height: 60px;}
.leftmenup .left-menu-header{    width: 250px;    display: inline-block;    float: left;}
.leftmenup .left-menu-content{      width: calc(100% - 250px);
    display: inline-block;
    float: left;height:auto;}
.leftmenup #accordion-menu li{float:left;}
.leftmenup #overlay{display: none!important;}
.leftmenup .history-show-bar{top:79px;}
.leftmenup .left-menu-footer{display:none;}
.leftmenup #hide-left-menu-link{display:none;}


.leftmenup .left-menu-content ul ul{position: absolute;width:220px;background-color: var(--bg-color-1)!important;}
.leftmenup .left-menu-content ul ul li{float:none!important;}


.sidebarbtn{background-color: var(--bg-color-1)!important;}
.header-right-menu li.searchicon a.open-search-link{background-color: var(--bg-color-1)!important;}
.history-show-bar{background-color: var(--bg-color-1)!important;}
#top-links .toplinks-content a.active{background-color: var(--bg-color-1)!important;color: var(--text-color)!important;border:solid 1px #333;text-decoration: blink;
	-webkit-animation-name: blinker;
	-webkit-animation-duration: .6s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-timing-function:ease-in-out;
	-webkit-animation-direction: alternate;}
    @-webkit-keyframes blinker {
        from {opacity: 1.0;}
        to {opacity: 0.0;}
      }






/*Prince*/


    

.languagetype {
 
  margin: 5px 10px 5px 10px;
}

.languagetype a {

  padding: 10px 10px 10px 10px;

     font-size:12px;border:solid 1px #ccc; border:none;color:#000;
}

 .languagetype ul li a:hover {
    color: #ccc;text-decoration:none;  }





.toplinks-content a.ctive {
background:#111}


.replayslider {
  -webkit-appearance: none;
  width: 100%;
  height: 4px;
  background: #d3d3d3;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
}

.replayslider:hover {
  opacity: 1;
}

.replayslider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  background: #4CAF50;
  cursor: pointer;border-radius:100%;
}

.replayslider::-moz-range-thumb {
  width: 20px;
  height: 20px;
  background: #4CAF50;
  cursor: pointer;border-radius:100%;
}
.historytableoverflow {max-height:calc(100vh - 201px);overflow-y:scroll
}

.footermenu {margin:0px;padding:0px;list-style:none
}
    .footermenu li {
    display:inline-block;width:30%;}
    
.left-menu-footer {

position: absolute;
  left: 0px;
  bottom:  0px;
  font-size:12px;
  padding:10px;
}
    .left-menu-footer a {
    display:block;padding:5px;color:#999;text-decoration:none;}
.left-menu-content{height:calc(100vh - 176px);overflow-y:scroll;}
.bottom-bar .tab-pane{background-color: var(--bg-color-1)!important;padding:10px;}
#main-map2{position: fixed;
    width: 100%;
    height: 90%;
    z-index: 1;
    object-fit: cover;top:10%}
.top-boxes{position:fixed;top:0px;height:10%;width:100%;left:0px;}
.top-boxes-block{    display: block;
    width: 100px;
    /* height: 100%; */
    
    padding:6px;
    color: #fff;
    border-radius: 3px;
    margin-top: 5px;
    margin-right: 10px;
    text-align: center;}
    .top-boxes-block strong{display:block;}
    .top-boxes-block:hover{color:#fff;}
    .replayview label{position:relative;top:5px;}



    /**Made by deepak**/
    .bottom-bar-replay {
position:fixed;bottom:0px;background:#eee;width:calc(100%);z-index:99;right:0px;opacity:0;visibility:hidden;transition:all .3s ease-in}
    .bottom-bar-replay.active {
    visibility:visible;opacity:1}
        .bottom-bar-replay.partial {
    width:calc(100% - 350px)}

     .bottombarreplayclosebtn {    background: none;
    border: none;
    float: right;
}
.bottombarreplayclosebtn img{    width: 14px;
    opacity: .5;
}

/* CSS DATE 20 - MAY - 2021*/


.setting-header {
padding:10px 20px!important;border-bottom:solid 1px #ccc;font-size:13px;}
.right-setting-bar {
padding:0px!important;}
.right-setting-content {
padding:20px;}
.speedbox-popover {
position:absolute;z-index:99;bottom:100px;background:#fff;padding:10px;left:10px;}
    .speedbox-popover label {
    display:block;padding:3px 0px;}
        .speedbox-popover label i {
        font-size:20px;margin-right:10px;}
.hoverpanel-block {    border: solid 3px #ccc;width: 410px!important;
}
#map_ctxmenu ul li{font-size:12px!important;
}
.leaflet-popup-content-wrapper{
box-shadow:0px 0px 10px rgba(0,0,0,.3)!important;border-top:solid 4px var(--highlight-color)!important;}    
#map_ctxmenu ul li i {
    font-size:16px;margin-right:7px;}
#map_ctxmenu ul li {padding:3px 3px;border-bottom:solid 1px #eee;
}
    #map_ctxmenu ul li:hover {
    background:#ccc;}
.tooltipouter{
    box-shadow:0px 0px 10px rgba(0,0,0,.3)!important;
border-top:solid 4px var(--highlight-color)!important!;border-top:solid 4px var(--highlight-color)!important;}
.valign {
vertical-align:middle!important}
.smallfont td{
font-size:12px!important;}
.form-wrp {background: #eee!important;height:auto!important
}
.select2-dropdown {
z-index:99999999999!important}
.leaflet-container {    font-family: 'Roboto', sans-serif!important;
}

    .leaflet-tooltip label {
       color: #333!important;
    font-weight: 600!important;
    font-size: 11px;margin-bottom:0px!important}
.leaflet-tooltip { box-shadow:1px 1px 1px rgba(0,0,0,.3);
}

.leaflet-tooltip {
margin-bottom:2px;}
.leaflet-tooltip {
}
.leaflet-tooltip .tagheading {font-size:13px;background-color: var(--highlight-color)!important;color:#fff;display:block;text-align:center;padding:3px;font-weight:400
    }
.max-width-ul {min-width:150px;
}
.ul-desc {
display:inline-block;}




.leaflet-bottom {   /* top:42%;*/
    right: 19px!important;
}

.leaflet-bottom a{ 
    display:none;
}
.leaflet-bar a, .leaflet-control-layers-toggle, .leaflet-popup-close-button, .map-tooltip.closable .close, .mapbox-button-icon:before, .mapbox-icon {
width:25px!important;height:25px!important;background-color:#fff;margin-bottom:11px;box-shadow:2px 2px 2px rgba(0,0,0,.1)}
.leaflet-touch .leaflet-bar, .leaflet-touch .leaflet-control-layers {
border:none!important;}
.leaflet-bar, .leaflet-control-layers {
background-color:rgba(0,0,0,0)!important}


#modal_poi .modal-content, #modal_geofence .modal-content {border: solid 10px #fff;
    box-shadow: 0px 0px 30px rgb(0 0 0 / 20%);background-color: var(--bg-color-2)!important;
}
#modal_poi .nav-tabs .nav-item.show .nav-link,#modal_geofence .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link a.active{    background-color: var(--bg-color-2);
}

.marker-div-image {
width:40px!important;height:40px!important;}
#modal_poi  .nav-tabs,#modal_geofence  .nav-tabs {background:#fff;
}
    /*#modal_poi .nav-tabs .nav-item.show .nav-link,#modal_geofence .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link {
    padding:0px;}*/   
 #modal_poi .nav-tabs .nav-item.show .nav-link,#modal_geofence .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link a {
    display:block;padding:15px;color:#333}


.marker-div-icon-circleanim {width:40px!important;height:40px!important;
}
.ripple-red {width:40px!important;height:40px!important;
}
.ripple-green {width:40px!important;height:40px!important;
}
.geocoder-control-input {
background-color:#fff!important}
.geocoder-control {
z-index:99999999999999999!important;position:relative}
.esri-truncated-attribution {
display:none!important;}
.leaflet-control-layers-list {
background:#fff;position:relative!important;z-index:99999999999999!important;padding:6px;}

