@font-face {
    font-family: 'UKNumberPlate';
    src: url('../../../fonts/UKNumberPlate.ttf'); /* IE9 Compat Modes */
}
html,body{
    height: 100%;
    min-width:800px;
    min-height: 400px;
}
body{
    font-family: Arial;
    font-size: 12px;
}
/* css reset start*/
input,
fieldset{
    border: none;
}
ul,
input,
textarea,
fieldset,
html,
body{
    margin: 0;
    padding: 0;
}
textarea{
    resize: none;
}
ul{
    list-style: none;
}
input{
    border: none;
    outline: none;
    background: transparent;
}
input[type="submit"]{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}
input[type="radio"],
input[type="checkbox"]{
    display: none;
}
input::-webkit-input-placeholder{
    font-size:12px;
}
input::-moz-placeholder{
    font-size:12px;
}
input:-ms-input-placeholder{
    font-size:12px;
}
input:-moz-placeholder{
    font-size:12px;
}
input:focus::-webkit-input-placeholder{
    opacity: 0;
}
input:focus::-moz-placeholder{
    opacity: 0;
}
input:focus:-ms-input-placeholder{
    opacity: 0;
}
input:focus:-moz-placeholder{
    opacity: 0;
}
/* css reset end*/
.wrapper{
    height: 100%;
    background-color: #22272B;
    overflow: hidden;
    position: relative;
}
#content{
    height:100%;
}
/* system message alert start */
.message-alert-popup {
    display: none;
    position: absolute;
    top: 0;
    left: calc(50% - 170px);
    opacity: 0;
    z-index: 11;
    width: 340px;
    min-height: 50px;
    max-height: 70px;
    background: #282828;
    border-radius: 2px;
    -moz-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    -webkit-transition: opacity 0.2s, top 0.7s;
    -moz-transition: opacity 0.2s, top 0.7s;
    -ms-transition: opacity 0.2s, top 0.7s;
    -o-transition: opacity 0.2s, top 0.7s;
    transition: opacity 0.2s, top 0.7s;
}
.message-alert-popup .header-panel {
    background: transparent;
    padding: 5px 5px 5px 8px;
    border: none;
}
.message-alert-popup .header-panel .close-btn {
    border: 0;
    padding: 0;
    float: right;
    background-color: transparent;
}
.message-alert-popup .header-panel .close-btn i {
    width: 8px;
    height: 8px;
    background-position: -292px -335px;
}
.message-alert-popup .header-panel .close-btn:hover {
    background-color: transparent;
}
.message-alert-popup .header-panel .close-btn:hover i {
    background-position: -282px -335px;
}
.message-alert-popup .action-row {
    padding: 0 10px;
    line-height: 36px;
}
.message-alert-popup .action-row .alert-btn {
    position: relative;
    float: right;
    color: #fff;
    text-transform: uppercase;
    cursor: pointer;
}
.message-alert-popup .action-row .alert-btn:hover {
    color: #a02e2f;
}
.message-alert-popup .action-row .alert-btn.cancel {
    margin-right: 20px;
}
.message-alert-popup.open {
    display: block;
    opacity: 1;
    top: 0;
    -webkit-transition: opacity 1.2s, top 0.7s;
    -moz-transition: opacity 1.2s, top 0.7s;
    -ms-transition: opacity 1.2s, top 0.7s;
    -o-transition: opacity 1.2s, top 0.7s;
    transition: opacity 1.2s, top 0.7s;
}
.message-alert {
    color: #a1a1a1;
    font-size: 11px;
    letter-spacing: -0.2px;
    padding: 4px 5px 0 15px;
}
.message-alert i {
    width: 13px;
    height: 11px;
    display: inline-block;
    margin-right: 10px;
    vertical-align: bottom;
}
.message-alert.success i {
    background-position: -209px -351px;
}
.message-alert.dialog i {
    background-position: -239px -351px;
}
.message-alert.error i {
    background-position: -225px -351px;

}
/* system message alert end */
/*login form start*/
.login-wrap{
    position: absolute;
    top:50%;
    left:50%;
    margin: -58px 0 0 -178px;
    /*margin:-83px 0 0 -178px;*/
}
.login-wrap.center{
    margin:-83px 0 0 -178px;
}
.login-wrap .panel{
    overflow: hidden;
}
.login-wrap .panel .logo{
    padding: 6px 0 8px 18px;
    float: left;
}
.login-wrap .inner-cover{
    padding-left: 16px;
    margin-top: -2px;
}
.login-wrap .row{
    padding-bottom:8px;
    width:340px;
}
.table-icon.image i,
.table-icon.video-available i,
.table-icon.video-uploaded i,
.table-icon.video-getting i,
.table-icon.video i,
.vp-download-btn i,
.vp-download-btn a,
.vp-exit-fullscreen-btn i,
.vp-fullscreen-btn i,
.vp-play-btn i,
.vp-stop-btn i,
.vp-volume-btn i,
.vp-volume-mute-btn i,
.camera-video .ui-selectmenu-button .ui-icon,
.camera-ico.video-uploaded-square,
.camera-ico.video-uploading-square{
    background: url("/img/html/roadstream.io/video_sprite.png") no-repeat;
}
.login-wrap .row-wrap,
.login-wrap .login .btn-holder,
.login-wrap .login .btn-holder .login-btn,
.message-alert i,
.alert--popup__content i,
.user-profile-popup__password .row i,
.file-preview .profile-file-preview i.profile-ico,
.left-panel .slide-btn,
.report .slide-btn,
.dd-wrapper .ico-select-open,
.dd-wrapper .ico-select-closed,
.left-panel .right-col .menu .groups-btn .ico,
.left-panel .right-col .control-panel ul li .ico,
.forgotten-pass .email-holder,
.forgotten-pass .btn-holder:before,
.forgotten-pass .btn-holder:after,
.left-panel .right-col .btns-holder .arrow,
.left-panel .right-col .btns-holder .ico,
.left-panel .right-col .vehicle-header .zoom i,
.scrollbar .handle .bg,
.forgotten-pass .message i,
.map-tools .slide-btn,
.map-tools .option-btn,
.checkbox,
.user-menu .categories li i,
.map-tools input[type="submit"],
.proximity .title-holder i,
.proximity-view .title-holder i,
.report-popup .select .title-holder i,
.resize-activity span,
.close-btn i,
.fwd-btn i,
.rwd-btn i,
.play-btn i,
.stop-btn i,
.remove-btn i,
.max-min_btn i,
.left-panel .vehicle-frame .distance i,
.calendar-btn i,
.radio,
.user-profile-popup__password .row .new-pass i.new-password-info,
.ui-datepicker-prev .ui-icon,
.ui-datepicker-next .ui-icon,
.table-icon.asc i,
.table-icon.desc i,
.table-icon.filter i,
.input-holder-edit i,
.add-drop .arrow-holder .arrow-up i,
.add-drop .arrow-holder .arrow-down i,
.ui-selectmenu-button .ui-icon,
.todays-journeys .slide-btn,
.map-tools .input-holder .remove-btn,
.tabset-report-panel .slide-btn,
.tabset-report-panel .ooi-data .arrow-holder .arrow-up i,
.tabset-report-panel .ooi-data .arrow-holder .arrow-down i,
.input-holder.counter .arrow-holder .arrow-up i,
.input-holder.counter .arrow-holder .arrow-down i,
.add-poi-popup .add-poi-btn i,
table.info.content .edit,
.button .side-arrow,
table.info.content .delete,
table.info td .delete,
table.info td .edit,
.account-list .folder-ico,
.account-list .arrow-ico,
.driving-time .content-wrap .arrow-holder .arrow-up i,
.driving-time .content-wrap .arrow-holder .arrow-down i,
.car_big,
.car_middle,
.car_small,
.select .title-holder i,
.validation-ico,
.add-checklist i,
.circle-yes i,
.circle-no i,
.circle-warn i,
.circle-applicable i,
    /* react-reports */
.arrow-ico,
.scheduled-report-list .delete,
.scheduled-report-list .edit,
.manage-recipients .delete,
.manage-recipients .edit,
.weekdays-btn i,
.camera-ico,
.duplicate-ico,
.table-icon.video-uploaded i,
.table-icon.video-getting i,
.header-panel .vp-fullscreen-btn:hover i,
.popup-header .vp-fullscreen-btn:hover i,
.live-video.active,
.live-video.available,
.live-video.no-video,
.live-video.bad-connection,
.user-menu .categories .mapping i,
.user-menu .categories .sms i,
.star-ico,
.view-ico,
.lock-ico,
.comment-button,
.imgUrl-button,
.svg-menu-icon.svg-map-tools.icon-map-tools-tfl .ico {
    background: url("/img/html/roadstream.io/sprite.png") no-repeat;
    /*background: url("/img/html/sprite.png") no-repeat;*/
}
.forgotten-pass .btn-holder input {
    background: url("/img/html/roadstream.io/bg-sprite.png") 0 0 repeat-x;
    /*background: url("/img/html/bg-sprite.png") 0 0 repeat-x;*/
}
.login-wrap .row-wrap{
    background-position: 0 0;
}
.login-wrap .row-wrap.reverse{
    background-position: 0 -43px;
}
.login-wrap .row-wrap.reverse.active{
    background-position: 0 -129px;
}
.login-wrap .row-wrap.active{
    background-position: 0 -86px;
}
.login-wrap input{
    outline:none;
    background:none;
    border: none;
    margin: 0;
}
.login-wrap .row input{
    width:266px;
    height: 42px;
    margin: 0;
    padding: 0 5px 0 10px;
    font-size:14px;
}
.login-wrap a{
    color:#4d3997;
    font-size:12px;
    display: block;
    padding: 3px 0 0 3px;
}
.login-wrap .login .btn-holder{
    position: absolute;
    top: 18px;
    left: 298px;
    width: 52px;
    height: 52px;
    background-position: 0px -172px;
}
.login-wrap .login .btn-holder .login-btn{
    float:right;
    background-position: -53px -173px;
    width: 42px;
    height: 42px;
    margin: 5px;
    cursor: pointer;
    opacity: 1;
}
.login-wrap .login .btn-holder .login-btn:hover{
    float:right;
    background-position: -216px -173px;
    width: 42px;
    height: 42px;
    margin: 5px;
    cursor: pointer;
}
.login-wrap .login .btn-holder .login-btn.error{
    background-position: -96px -172px;
}
.login-wrap .login .btn-holder .login-btn.correct{
    background-position: -259px -173px;
}
.login-wrap .login .btn-holder .login-btn.active{
    background-position: -96px -172px;
}
.login-wrap .login .btn-holder .login-btn.loading{
    background-position: -143px -219px;
}
.popup,.popup .bg{
    position: absolute;
    left:0;
    top:0;
    height: 100%;
    width: 100%;
}
.popup .bg{
    background-color: #fff;
    opacity: 0.7;
}
.popup{
    display: none;
    z-index: 1;
}
.popup.active{
    display: block;
}
#footer{
    margin-top:-20px;
}
#footer span{
    color:#838a8d;
    font-size:11px;
    padding-left:5px;
}
input:focus::-webkit-input-placeholder{
    opacity: 0;
}
:focus::-moz-placeholder{
    opacity: 0;
}
:focus:-ms-input-placeholder{
    opacity: 0;
}
input:focus:-moz-placeholder{
    opacity: 0;
}
input.placeholder{
    color:#586974;
    font-size:14px;
}
::-webkit-input-placeholder{
    color:#586974;
    font-size:14px;
}
::-moz-placeholder{
    color:#586974;
    font-size:14px;
    font-style: regular;
}
:-ms-input-placeholder{
    color:#586974;
    font-size:14px;
    font-style: regular;
}
input:-moz-placeholder{
    color:#586974;
    font-size:14px;
    font-style: regular;
}

/*login form end*/
/*forgotten-pass start*/
.forgotten-pass{
    display: none;
}
.forgotten-pass .message{
    display: none;
}
.forgotten-pass.error .message{
    display: block;
    margin-left: 125px;
    color:#cc0000;
}
.forgotten-pass.ok .message{
    display: block;
    margin:-40px 0 0 136px;
    color:#000;
}
.forgotten-pass.ok .send-pass,.forgotten-pass.ok .email-holder{
    visibility: hidden;
}
.forgotten-pass .message p{
    font-size: 14px;
    margin-top: 7px;
}
.forgotten-pass.error .message i{
    padding: 1px 18px 0px 0px;
    background-position: -123px -227px;
    margin-left: 11px;
}
.forgotten-pass.ok .message i{
    background-position: -123px -244px;
    padding: 1px 18px 0px 0px;
    margin-left: 9px;
}
.forgotten-pass .go-back,.forgotten-pass .send-pass{
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    overflow: hidden;
    display: inline-block;
    border:1px solid #c7c7c7;
    -webkit-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,1);
    -moz-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,1);
    box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,1);

}
.forgotten-pass .go-back{
    left: 6px;
}
.forgotten-pass .send-pass{
    left: -6px;
}
.forgotten-pass .go-back,.forgotten-pass .send-pass{
    top:-1px;
    position: relative;
    z-index: 1;
}
.forgotten-pass .btn-holder{
    height:31px;
    padding:0 16px 0 16px;
    line-height:33px;
    text-decoration:none;
    position: relative;
    margin: 5px;
    top:-1px;
    cursor: pointer;
}
.forgotten-pass .btn-holder:hover:before{
    background-position: -43px -227px;
}
.forgotten-pass .btn-holder:hover:after{
    background-position: -61px -227px;
}
.forgotten-pass .bg{
    background-color: #fff;
    opacity: 0.8;
}
.forgotten-pass .btn-holder input{
    background-position:0 -24px;
    padding: 0;
    height: 33px;
    cursor: pointer;
    color:#fff;
}
.forgotten-pass .btn-holder:hover input{
    background-position: 0 -58px;
}
.forgotten-pass .btn-holder:before,
.forgotten-pass .btn-holder:after{
    cursor: pointer;
    content:"";
    width:16px;
    height:33px;
    position: absolute;
    top: 0;
}
.forgotten-pass .btn-holder:before{
    left:0;
    background-position: -2px -227px;
}
.forgotten-pass .btn-holder:after {
    clear:both;
    right:0;
    background-position: -24px -227px;
}
.forgotten-pass .panel span{
    display: block;
    color:#cc0000;
    font-size: 14px;
    margin-top: 7px;
}
.forgotten-pass .email-holder{
    background-position: 0 -262px;
    display: inline-block;
    width: 310px;
    height: 44px;
    overflow: hidden;
}
.forgotten-pass .email-holder input{
    padding: 14px 0 10px 24px;
    width: 270px;
}
.login-wrap.forgotten .forgotten-pass{
    display: block;
}
.login-wrap .forgotten-pass .panel .logo{
    padding-bottom: 11px;
}
.login-wrap .forgotten-pass .inner-cover{
    padding-left: 0;
    margin-left: -122px;
}
.login-wrap.forgotten .login{
    display: none;
}
/*forgotten-pass end*/
/* menu start */
.menu tr{
    overflow: hidden;
    background-color: #fff;
}
.menu tr td{
    padding: 9px 6px;
    font-family: Verdana;
    border-bottom:1px solid #b3b9ba;
    border-right:1px solid #b3b9ba;
    cursor: pointer;
}
.menu tr td,
.menu li,
.left-panel .right-col .control-holder .ch-line,
.slide-button,
.map-tools .map-tools-frame,
.map-tools .option-frame.first,
.left-col .title,
.user-menu .tab .title,
.close-btn,
.header-panel-undraggable,
.header-panel,
.tooltip-arrow::after,
.tooltip-arrow::before,
.report-header,
.popup-header,
.switch-slider:before {
    background: #dfe6eb;
}

.menu tr .active{
    background: #fff;
    color: #586974;
    border-bottom: none;
}
/* menu end */
/* user profile start */
.user-profile-panel {
    position: absolute;
    width: 420px;
    z-index: 3;
    background: white;
    -moz-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
}
.user-profile-panel .header-panel {
    cursor: move;
}
.user-profile-wrap .header-panel .button {
    float: right;
    text-decoration: none;
}

.profile-info {
    padding: 10px;
}

.profile-info .user-image {
    position: relative;
    width: 80px;
    height: 80px;
    display: inline-block;
    vertical-align: middle;
}
.profile-info .user-image img {
    width: 100%;
    height: 100%;
}
.profile-info .user-image .add-profile-image {
    width: 100%;
    height: 100%;
    background: rgba(90, 90, 90, 0.6);
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
    text-align: center;
    opacity: 0;
    -webkit-transition: opacity 0.7s;
    -moz-transition: opacity 0.7s;
    -ms-transition: opacity 0.7s;
    -o-transition: opacity 0.7s;
    transition: opacity 0.7s;
}
.profile-info .user-image .add-profile-image span {
    position: absolute;
    top: 43%;
    left: 0;
    right: 0;
    color: #fff;
    font-weight: bolder;
}
.profile-info .user-image:hover .add-profile-image {
    opacity: 1;
    -webkit-transition: opacity 0.7s;
    -moz-transition: opacity 0.7s;
    -ms-transition: opacity 0.7s;
    -o-transition: opacity 0.7s;
    transition: opacity 0.7s;
}

.profile-info .user-info {
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
}

.profile-info .user-info p:first-child {
    margin-top: 0;
}

.profile-info .user-info .change-pass {
    width: 99px;
}
/* user profile end */
/* user profile image upload start */
.user-profile-popup__image {
    position: absolute;
    top: 0;
    left: calc(50% - 200px);
    min-width: 400px;
    display: none;
    z-index: 3;
    background: #fff;
    -moz-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
}
.user-profile-popup__image .header-panel {
    cursor: move;
}
.file-preview {
    padding: 0 5px 0 10px;
    display: none;
}

.file-preview .profile-file-preview  {
    display: inline-block;
}

.file-preview  .profile-file-preview > * {
    display: inline-block;
    vertical-align: middle;
}
.file-preview  .profile-file-preview img {
    width: 40px;
    height: 40px;
    vertical-align: middle;
}

.file-preview .profile-file-preview span {
    margin-left: 5px;
    max-width: 260px;
    overflow: hidden;
}
.file-preview .profile-file-preview i.profile-ico {
    margin-left: 5px;
    width: 12px;
    height: 10px;
    background-position: -260px -337px;
}
.file-preview .remove-btn {
    float: right;
    margin-top: 7px;
    margin-left: 7px;
    padding: 5px;
    background: #fff;
    border: 1px solid #fff;
    cursor: pointer;
}
.file-preview .remove-btn i {
    width: 15px;
    height: 17px;
    display: block;
    background-position: -172px -321px;
}
.file-preview .remove-btn:hover i {
    background-position: -172px -357px;
}
.user-profile-popup__image .upload-box {
    margin: 25px 30px;
    padding: 40px 0;
    border: 2px dashed #ddd;
    text-align: center;
    color: #aaa;
}
.user-profile-popup__image .upload-box.is-dragover {
    background: #999999;
    border-color: #fff;
    color: #fff;
}
.user-profile-popup__image .upload-box strong {
    font-size: 20px;
}
.user-profile-popup__image .upload-box__input label {
    color: #e2003b;
    text-decoration: underline;
}
.user-profile-popup__image .upload-box__input p{
    margin: 30px 0;
}

.crop-photo {
    /*display: none;*/
    margin: 20px 25px;
}
.user-profile-popup__image .action-row {
    padding: 10px 10px 0;
    border-top: 1px solid #999;
}

.user-profile-popup__image .action-row .button {
    margin-bottom: 10px;
}

.user-profile .tooltip>img {
    border-bottom: 1px solid #999;
    width: 40px;
    height: 40px;
    margin-top: -11px;
    margin-left: -9px;
    position: absolute;
    display: none;
}
/* user profile image upload end */
/* user profile popup start */
.user-profile-popup__password {
    position: absolute;
    width: 350px;
    z-index: 3;
    background: white;
    -moz-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
}
.user-profile-popup__password .before {
    content: "";
    position: absolute;
    left: calc(50% - 23px);
    top: -7px;
    width: 0;
    height: 0;
    background: transparent;
    box-sizing: border-box;
    border: 5px solid #fff;
    border-color: #363939 transparent transparent #363939;
    -webkit-box-shadow: -1px -1px 1px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: -1px -1px 1px 0px rgba(0,0,0,0.3);
    box-shadow: -1px -1px 1px 0px rgba(0,0,0,0.3);
    transform-origin: 0 0;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.user-profile-popup__password .header-panel {
    cursor: move;
}
.user-profile-popup__password .row {
    overflow: hidden;
    padding: 4px 10px;
}
.user-profile-popup__password .row span {
    line-height: 26px;
    float: left;
}
.user-profile-popup__password .row label {
    position: relative;
    display: block;
    padding-left: 6px;
    margin-left: 110px;
    margin-right: 20px;
}

.user-profile-popup__password .row label.disabled input {
    cursor: not-allowed;
}
.user-profile-popup__password .row .curr-pass.error {
    border-color: red;
}
.user-profile-popup__password .row .curr-pass.hide-pass i,
.user-profile-popup__password .row .curr-pass.show-pass i {
    position: absolute;
    right: 0;
    top: 5px;
    margin-right: -22px;
    width: 16px;
    height: 11px;
    background-position: -281px -308px;
}
.user-profile-popup__password .row .curr-pass.hide-pass i {
    background-position: -281px -320px;
}
.user-profile-popup__password .row .curr-pass.show-pass i:hover {
    background-position: -299px -308px;
}
.user-profile-popup__password .row .curr-pass.hide-pass i:hover {
    background-position: -299px -320px;
}

.user-profile-popup__password .row .new-pass.approved {
    border-color: green;
}

.user-profile-popup__password .row .new-pass i.new-password-icon {
    display: none;
    position: absolute;
    right: 0;
    top: 5px;
    margin-right: -22px;
    width: 12px;
    height: 11px;
    background-position: -245px -336px;
}
.user-profile-popup__password .row .new-pass i.new-password-info {
    display: block;
    position: absolute;
    top: 5px;
    left: 0;
    margin-left: -20px;
    width: 14px;
    height: 14px;
    background-position: -259px -349px;
}
.user-profile-popup__password .row .new-pass.confirm i.new-password-icon {
    background-position: -260px -336px;
}
.user-profile-popup__password .row .confirm-pass i {
    display: none;
    position: absolute;
    right: 0;
    top: 5px;
    margin-right: -22px;
    width: 12px;
    height: 11px;
    background-position: -245px -336px;
}
.user-profile-popup__password .row .confirm-pass.approved {
    border-color: green;
}
.user-profile-popup__password .row .confirm-pass.error {
    border-color: red;
}
.user-profile-popup__password .row .confirm-pass.confirmed i {
    background-position: -260px -336px;
}
.user-profile-popup__password .action-row {
    padding: 10px 10px 0;
}

.user-profile-popup__password .action-row .button {
    margin-bottom: 10px;
}

/* user profile popup end */
/* search start*/
.search{
    position: relative;
}
.search .dropdown{
    top:25px;
    left:0;
}
.search input{
    font-style: italic;
}
.search .input-holder{
    border: 1px solid #bfbfbf;
}
.search .input-holder .button {
    padding: 6px 11px 5px 11px;
    display: block;
}
.search .input-holder:first-child{
    float: right;
    border: none;
    margin-left: 5px;
}
.search .input-holder:last-child{
    -webkit-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    display: block;
    overflow: hidden;
    padding-left: 5px;
}
.input-holder,
textarea{
    -webkit-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    border: 1px solid #b3b9ba;
}
.search input[type="text"]{
    width: 100%;
    padding: 6px 0px 5px 0;
    font-size: 12px;
}
.search ::-webkit-input-placeholder{
    font-size:12px;
}
.search ::-moz-placeholder{
    font-size:12px;
}
.search :-ms-input-placeholder{
    font-size:12px;
}
.search input:-moz-placeholder{
    font-size:12px;
}
/* search end */
/* account list start */
.account-list {
    padding: 6px 0 0 0;
    color:#586974;
}
.account-list{
    overflow: hidden;
}
.account-list .marker{
    padding: 2px;
    float:left;
    background-color: #4d3997;
    margin: 4px 7px 0 0;
}
.account-list>li{
    padding:0 0 0 8px;
}
.account-list li>ul{
    display: none;
    margin: 0 0 0 17px;
}
.account-list li.active>ul{
    display: block;
}
.account-list .arrow-ico,
.account-list .folder-ico{
    position: relative;
}
.account-list .folder-ico{
    left: -2px;
    top:auto;
}
ul.account-list>li.active>.account-folder .folder-ico,
.account-list ul>li.active>.account-folder .folder-ico{
    background-position: -142px -195px;
    top: -1px;
    left:-2px;
}
ul.account-list>li.active>.account-folder .arrow-ico,
.account-list ul>li.active>.account-folder .arrow-ico{
    top: -1px;
    left: 1px;
    background-position: -147px -174px;
}
.account-list>li .account-folder:hover{
    background-color: #d0e4ee;
    color:#586974;
}
.account-list .folder-ico,
.account-list .arrow-ico{
    display: inline-block;
}
.account-list .ico-holder{
    float: left;
    padding-top: 1px;
    padding-right: 3px;
    cursor: pointer;
}
.account-list .group{
    cursor: pointer;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.account-list ul>li .arrow-ico,
ul.account-list>li .arrow-ico{
    margin:0 4px 2px 0;
    width: 7px;
    height: 8px;
    background-position: -140px -173px;
}
.account-list .folder-ico{
    width: 17px;
    height: 12px;
    background-position: -142px -182px;
    position: relative;
    left: -2px;
}
.account-list .account-folder{
    padding: 4px 0 4px 100px;
    margin-left: -100px;
    cursor: pointer;
}
/* account list end */
/* slide button start */
.slide-button{
    position: absolute;
    top: 0;
    right: -32px;
    padding: 5px 8px 8px 12px;
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.5);
    z-index: -1;
    cursor: pointer;
}
.slide-button .line{
    width: 1px;
    height: 20px;
    float: left;
    margin-right: 3px;
    background: #b8b7b7;
    opacity: 0.5;
}
.slide-button .line:last-child{
    padding: 0;
}
/* slide button end */
/*left-panel start*/
.left-panel{
    font-size: 12px;
    position: absolute;
    top: 0;
    left:0;
    z-index: 101;
}
.left-panel.has-group-tab{
    padding-left: 35px;
}
.left-panel.no-group-tab{
    padding-left: 0;
}

.left-panel.has-group-tab .group-tab-container{
    display: block;
}
.map-wrap{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}
.left-col{
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 287px;
    height: 100%;
}
.left-col:before {
    content: "";
    width: 100%;
    position: absolute;
    top: -5px;
    right: -100%;
    bottom: -5px;
    z-index: 3;
    -webkit-box-shadow: -8px 0px 6px -4px rgba(0,0,0,0.6);
    -moz-box-shadow: -8px 0px 6px -4px rgba(0,0,0,0.6);
    box-shadow: -8px 0px 6px -4px rgba(0,0,0,0.6);
}
.left-panel.active{
    left:0;
}
.left-col .title{
    color:#586974;
    background-color: #dfe6eb;
    border-bottom: 1px solid #dfe6eb;
}
.left-col .title span{
    line-height: 23px;
    padding: 5px 0 5px 9px;
    display: inline-block;
}
.user-menu .account-folder{
    padding: 6px 13px 3px 100px;
}
.left-panel .right-col{
    width: 327px;
    /*height: 100%;*/
    /*overflow: hidden;*/
    /*position: relative;*/
    /*float:left;*/
    -moz-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
}

.left-panel .right-col .vehicle-frame .vehicle-header .btns-holder .options:active .ico,
.left-panel .right-col .vehicle-frame .vehicle-header .btns-holder .options.active .ico{
    background-position: -69px -347px;
}
.left-panel .right-col .vehicle-frame .vehicle-header .btns-holder .zoom:active i {
    background-position: -69px -361px;
}
.left-panel .right-col .vehicle-frame .vehicle-header .btns-holder .zoom.active:active i {
    background-position: -82px -361px;
}
.left-panel .right-col .vehicle-frame .vehicle-header .btns-holder .options:active .arrow,
.left-panel .right-col .vehicle-frame .vehicle-header .btns-holder .options.active .arrow{
    background-position: -82px -349px;
}

.left-panel .right-col .slidee:after {
    content: '';
    display: table;
    clear: both;
}

.left-panel .right-col .slidee-column {
    float: left;
    width: 323px;
}
.left-panel .right-col .row.isotope-elem,
.left-panel .right-col .slidee-column:last-child {
    width: 319px;
}
.left-panel .slide-btn,
.report .slide-btn,
.tabset-report-panel .slide-btn{
    width: 38px;
    height: 38px;
    background-position: -163px -173px;
    position: absolute;
    right: -35px;
    top: -4px;
    cursor: pointer;
}
.left-panel .right-col .control-holder{
    position: relative;
    background-color: #fff;
}
.left-panel .right-col .control-holder .ch-line {
    position: absolute;
    width: 100%;
    height: 33px;
    /*background: #dadcdd;*/
}
.left-panel .right-col .control-holder .row{
    padding: 5px 10px 5px 5px;
    border-top: 1px solid #ccc;
    background-color: #fff;
}
.report-page .left-panel .right-col .control-holder > .row{
    background-color: #000;
    display: none !important;
}
.left-panel .right-col .menu .groups-btn .ico{
    width: 8px;
    height: 7px;
    display: inline-block;
    background-position: -204px -184px;
    padding: 0 0 1px 4px;
    margin-left: -2px;
}
.left-panel.active .right-col .menu .groups-btn .ico{
    background-position: -204px -176px;
}
.left-panel.active .right-col .menu .groups-btn{
    color: #586974;
    background: #fff;
}
.left-panel .right-col .control-panel{
    height: 15px;
    padding: 7px 0 6px 6px;
    color: #586974;
    border-top: 1px solid #dadcdd;
    margin-top: -1px;
}
.left-panel .right-col .control-panel .expand span:last-child,
.left-panel .right-col .control-panel .expand.active span:first-child{
    display: none;
}
.left-panel .right-col .control-panel .expand.active span:last-child{
    display: inline;
}
.left-panel .right-col .control-panel > ul > li{
    float:left;
    padding-right: 22px;
    position: relative;
}
.left-panel .right-col .control-panel > ul > li > span{
    font-family: Verdana;
    cursor: pointer;
}
.left-panel .right-col .control-panel ul li .ico{
    background-position: -204px -192px;
    display: inline-block;
    width: 6px;
    height: 3px;
    margin: 0 0 2px 4px;
}
/* SEARCH VARIANTS STYLES */
.search-variants-holder {
    display: none;
    max-height: 300px;
    box-shadow: 0 2px 3px 0 rgba(0,0,0,0.4);
    cursor: pointer;
    background-color: #fff;
    z-index: 1;
}
.search-variant__name {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 155px;
}
.search-helper {
    content: "";
    clear: both;
    float: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 135px;
}
.search-variants-holder li {
    padding: 6px 12px 4px;
}
/*.helper-title {*/
/*font-weight: 700;*/
/*}*/
/* SEARCH VARIANTS STYLES END */
.left-panel .right-col .vehicle-holder{
    background: #fff;
    position: relative;
}
.left-panel.has-group-tab .right-col .vehicle-holder{
    min-height: 300px;
}
.left-panel .right-col .actions-holder {
    padding: 10px;
    color: #fff;
    height: 26px;
    background-color: #fff;
    display: none;
}
.search-variants-holder li {
    padding: 8px 12px
}
.search-variants-holder li:hover {
    background: #bfc2c4;
    color: #586974333;
}
.left-panel .right-col .row{
    overflow: hidden;
    position: relative;
}
.left-panel .right-col .vehicle-search.row{
    overflow: visible;
}
.left-panel .right-col .vehicle-frame{
    border-bottom: 1px solid #d9d9d9;
    color: #586974;
    margin-bottom: 4px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.left-panel .vehicle-frame .distance{
    min-width: 84px;
    display: none;
    float: right;
    margin: 5px 11px 0 0;
}
.left-panel .vehicle-frame .distance i{
    background-position: -302px -196px;
    float: left;
    width: 12px;
    height: 16px;
}
.left-panel .vehicle-frame .distance span{
    margin-left: 6px;
}
.left-panel .vehicle-frame .digital-input{
    background-color: #000;
    color: #fff;
}
.left-panel .right-col .digital-input dl{
    margin: 0;
    border-top: 1px solid #dadada;
}
.left-panel .right-col .digital-input dt{
    float: left;
    clear: left;
}
.left-panel .right-col .digital-input dd{
    margin: 0;
}
.left-panel .right-col .digital-input dd span{
    margin-left:3px;
}
.left-panel .right-col .row.active .vehicle-header{
    background: none;
}
.left-panel .right-col .row.active .data-holder,
.left-panel .right-col .row.active .vehicle-header{
    background-color: #dfe6eb;
}
.left-panel .right-col .vehicle-holder .row:last-child{
    padding: 0;
}
.left-panel .right-col .info{
    display: none;
}
.left-panel .right-col .info .state{
    text-transform:uppercase;
}
.left-panel .right-col .info .state{
    padding: 6px 0 5px 5px;
    line-height: 8px;
    color:#fff;
    font-size: 11px;
    font-weight: bold;
}
.left-panel .right-col .info .state.idling{
    background-color: #ff8000;
}
.left-panel .right-col .info .state.on,
.left-panel .right-col .info .state.moving{
    background-color: #50b249;
}
.left-panel .right-col .info .state.off,
.left-panel .right-col .info .state.parked{
    background-color: #ff0000;
}
.left-panel .right-col .info .data-holder{
    border-bottom: none;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    border-right: 1px solid #d9d9d9;
    border-left: 1px solid #d9d9d9;
}
.left-panel .right-col .info .line{
    width: 97px;
    overflow: hidden;
    float: left;
    position: relative;
}
.left-panel .right-col .info .data-right-col{
    line-height: 13px;
    padding: 10px 12px 8px 5px;
    font-size: 11px;
    overflow: hidden;
}
.left-panel .right-col .info .data-right-col p{
    margin:0;
}
.left-panel .right-col .info .data-right-col dl{
    margin: 0;
    color: #3f92e7;
}
.left-panel .right-col .info .data-right-col dt{
    float: left;
    clear: left;
}
.left-panel .right-col .info .data-right-col dd{
    margin: 0;
}
.left-panel .right-col .info .data-right-col dd span{
    margin-left:3px;
}
.left-panel .right-col .info .data-left-col{
    padding: 13px 0 9px 16px;
}
.left-panel .right-col .info .data-left-col span{
    font-size: 11px;
    display: block;
    margin-top: -3px;
}
.left-panel .right-col .info .row{
    padding: 0 0 12px 0;
}
.left-panel .right-col .info .row:first-child{
    height: 23px;
}
.left-panel .right-col .info .row img{
    float: left;
}
.left-panel .right-col .info .row img[src*="nextGenActivityIcons"]{
    width: 20px;
    height: 20px;
}
.left-panel .right-col .info .row i{
    float: left;
    margin: 1px 0 1px 9px;
}
.left-panel .right-col .vehicle-header {
    background-position: 0 -92px;
    overflow: hidden;
    border: 1px solid #d9d9d9;
    border-bottom: none;
    cursor: pointer;
    height: 25px;
}
.left-panel .right-col .vehicle-header .row:first-child{
    border: 1px solid #9b9999;
}
.left-panel .right-col .vehicle-header .data{
    padding: 4px 0 0 4px;
    float: left;
    line-height: 18px;
}
.left-panel .right-col .btns-holder{
    margin: 3px 11px 0 0;
    float: right;
}
.left-panel .right-col .btns-holder div,
.left-panel .right-col .btns-holder span{
    float: left;
    overflow: hidden;
}
.left-panel .right-col .vehicle-header .options,
.left-panel .right-col .vehicle-header .zoom{
    background-color: #e7ecf0;
    border: 1px solid #d5dde4;
    cursor: pointer;
}
.left-panel .right-col .vehicle-header .options{
    padding: 1px 4px 3px 4px;
    position: relative;
}

.left-panel .right-col .vehicle-header .btns-holder .zoom:active i{
    background-position: -94px -227px;
}
.left-panel .right-col .vehicle-header .zoom:hover i{
    background-position: -175px -307px;
}
.left-panel .right-col .vehicle-header .btns-holder .zoom.active:active i{
    background-position: -94px -242px;
}
.left-panel .right-col .vehicle-header .zoom.active:hover i{
    background-position: -190px -307px;
}
.left-panel .right-col .vehicle-header .zoom.active:hover i{

}
.options-drop{
    margin-top: 6px;
}
.options-drop,
.sub-options-drop{
    background: #fff;
    position: absolute;
    top: 15px;
    left: -3px;
    z-index: 2;
    -webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.5);
    display: none;
}
.sub-options-drop{
    top: -4px;
    left: 100%;
}
.options-drop li{
    color:#586974;
    position: relative;
}
.options-drop ul{
    padding: 4px 0 3px 0;
}
.options-drop li:hover>.sub-options-drop{
    display: block;
}
.options-drop li:hover{
    background-color: #ceeafd;
}
.options-drop li span{
    padding: 5px 11px 4px 8px;
    line-height: 9px;
    display: block;
    cursor: pointer;
    white-space: nowrap;
}
.sub-options-drop li span{
    margin: 2px 0 0 18px;
    padding: 0;
}
.sub-options-drop li label{
    padding: 2px 11px 5px 8px;
    display: block;
}
.sub-options-drop input[type="checkbox"]{
    float: left;
    margin: 0;
}
.left-panel .right-col .vehicle-header .zoom.active i{
    background-position: -94px -242px;
}
.left-panel .right-col .vehicle-header .options:hover .ico{
    background-position: -81px -241px;
}
.left-panel .right-col .btns-holder .ico{
    background-position: -81px -227px;
    padding: 6px 5px 7px 7px;
    margin: 1px 0 -1px 0;
}
.left-panel .right-col .vehicle-header .btns-holder .options:active .ico,
.left-panel .right-col .vehicle-header .btns-holder .options.active .ico{
    background-position: -81px -227px;
}
.left-panel .right-col .vehicle-header .btns-holder .options:active .arrow,
.left-panel .right-col .vehicle-header .btns-holder .options.active .arrow{
    background-position: -109px -227px;
}
.left-panel .right-col .btns-holder .arrow{
    /*float: right;*/
    background-position: -109px -227px;
    padding: 1px 3px 2px 2px;
    margin: 6px 0 4px 6px;
}
.left-panel .right-col .btns-holder .options:hover .arrow{
    background-position: -109px -231px;
}
.left-panel .right-col .vehicle-header .zoom{
    padding: 1px 1px 2px 2px;
    margin-left: 4px;
}
.left-panel .right-col .vehicle-header .zoom i{
    background-position: -94px -227px;
    padding: 7px;
    display: block;
}
.left-panel .right-col .vehicle-header .data span:first-child{
    display: inline-block;
    overflow: hidden;
    width: 72px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.left-panel .right-col .vehicle-header .data img{
    padding: 0 19px;
}
.left-panel .right-col .vehicle-header .data img[src*="nextGenActivityIcons"]{
    width: 16px;
    height: 16px;
    vertical-align: middle;
}
.left-panel .right-col .vehicle-header .data span:last-child{
    float: right;
}
table.menu{
    border-collapse: separate;
    border-spacing: 0;
    width: 327px;
    height: 34px;
    position: relative;
}
table.menu:before{
    position: absolute;
    bottom:0;
    width: 100%;
    content: "";
    background: #aeb0b1;
    z-index: 1;
}
table.menu td.active:after{
    position: absolute;
    top: 0;
    right: -1px;
    left: -1px;
    bottom:0;
    content: "";
    background: #fff;
    border-left: 1px solid #b3b9ba;
    border-right: 1px solid #b3b9ba;
    z-index: 2;
}
table.menu td.active:last-child {
    border-right: 0;
}
table.menu td.active:last-child:after{
    border-right: 0;
    right: 0;
}
table.menu td.active span{
    position: relative;
    z-index: 3;
}
table.menu td{
    border-spacing: 0;
    text-align: center;
    color: #586974;
    position: relative;
}
.vehicle-holder .scroll-frame {
    margin-right: 4px;
    margin-left: 4px;
    padding-bottom: 4px;
}
.scroll-frame{
    position: relative;
}
#reports .scroll-frame{
    padding-bottom: 5px;
}
.right-col .scrollbar, #reports .scrollbar {
    right: -4px;
    z-index: 1;
}
.scroll-frame.active{
    padding-right: 0;
}
.scroll-content{
    overflow: hidden;
}
.scroll-frame.active .scrollbar{
    display: block;
}
.scrollbar {
    opacity: 0;
    position: absolute;
    top: 0;
    height: 100%;
    width: 10px;
}
.right-col .scrollbar,
.left-col .scrollbar{
    opacity: 0;
    position: absolute;
    top: 0;
    height:100%;
    width:10px;
}
.right-col .scrollbar{
    right:0;
    z-index: 1;
}
.left-col .scrollbar{
    right: 1px;
    z-index: 1;
}
.scrollbar .handle{
    overflow: hidden;
    width:100%;
    background-color: #ccc;
    height: 100px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    cursor: pointer;
}
.scrollbar .handle .bg{
    position: absolute;
    top: 50%;
    left: 50%;
    margin:-3px 0 0 -3px;
    width: 6px;
    height: 5px;
    background-position: -116px -227px
}
.scrollbar.vertical {
    position: absolute;
    top: 0;
    right: 1px;
    width: 10px;
    height: 100%;
    opacity: 0.5;
    z-index: 1;
    display: none;
}
.scrollbar .handle:hover .bg{
    background-position: -116px -233px
}
/*left-panel end*/
/*loader start*/
.loader-wrap{
    position: absolute;
    height: 100%;
    width: 100%;
    display: none;
}
.loading .loader-wrap{
    display: block;
}
#circularG{
    position:relative;
    width:60px;
    height:60px;
    left: 140px;
    top: 60px;
}
#map {
    background-color: #fff;
    height: 100%;
}
/*loader end*/
/* alternative loader */
.loader_c {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: rgba(1, 1, 1, 0.3);
}

#alt_loader {
    position: absolute;
    left: 50%;
    top: 50%;
    border: 12px solid #f3f3f3;
    border-radius: 50%;
    border-top: 12px solid #aeb0b1;
    border-bottom: 12px solid #aeb0b1;
    width: 50px;
    height: 50px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
/*map-tools start*/
.map-tools{
    position: absolute;
    top: 2px;
    left:500px;
    z-index: 103;
    display: none;
    font-size: 11px;
    color:#fff;
    background: #dfe6eb;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.30);
    -moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.30);
    box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.30);
}
.map-tools .slide-button {
    position: static;
    display: inline-block;
    vertical-align: inherit;
    width: 9px;
    /*height: 20px;*/
    /*float: left;*/
    margin-right: 8px;
    background: none;
    box-shadow: none;
    padding: 0;
}
.map-tools label{
    color: #586974;
}
.map-tools .slide-button .line:last-child{
    margin: 0;
}
.map-tools .ui-handle{
    /*position: absolute;*/
    /*top: 0;*/
    /*left: 0;*/
    height: 33px;
    /*width: 20px;*/
    cursor: move;
    /*z-index: 1;*/
}
input[type="checkbox"]{
    display: none;
}
.map-tools input[type="text"]{
    padding: 5px 0 4px 7px;
    font-size:11px;
    width: 107px;
    height: 13px !important;
}
.map-tools input[type="submit"]{
    position: static;
    width: 12px;
    height:12px;
    float: left;
    background-position: -188px -236px;
    opacity: 1;
}
.map-tools .input-holder{
    position: relative;
    width: 132px;
    float: left;
    -webkit-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.10);
    -moz-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.10);
    box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.10);
    background: #fff;
}
.map-tools .input-holder .remove-btn{
    position: absolute;
    top:50%;
    left:100%;
    width: 16px;
    height: 16px;
    margin-left: -18px;
    margin-top: -8px;
    background-position: -37px -308px;
}
.map-tools .input-holder .remove-btn:hover{
    background-position: -37px -326px;
}
.map-tools .search-btn{
    /*position: relative;*/
    padding: 6px 5px;
    overflow: hidden;
    float: left;
    border: none;
}

.map-tools form{
    padding: 5px 4px 4px;
}
.map-tools fieldset{
    width: auto;
}
.map-tools .map-tools-frame {
    /*display: inline-block;*/
    /*vertical-align: middle;*/
    visibility: visible;
    float: left;
    background: #dfe6eb;
}
.map-tools .option-frame{
}
.map-tools .option-frame.first{
    padding: 5px 7px;
    width: 37px;
    float: left;
    background: #dfe6eb;
}
.map-tools .option-frame-with-button .button {
    padding: 11px 13px 10px;
    border: none;
}
.map-tools .slide-button{
    position: static;
    width: 9px;
    margin-right: 8px;
    display: inline-block;
    vertical-align: inherit;
    background: none;
    box-shadow: none;
    padding: 0;
}
.map-tools .slide-button .line:last-child{
    margin: 0;
}
.map-tools .option-btn{
    display: inline-block;
    /*vertical-align: middle;*/
    width: 16px;
    height: 16px;
    background-position: -186px -219px;
    overflow: hidden;
    cursor: pointer;
    margin-bottom: 2px;
}
.map-tools .option-btn:hover,
.map-tools .option-btn.active {
    background-position: -37px -357px;
}
.map-tools li:last-child{
    /*border: none;*/
}
.checkbox{
    display: block;
    float: left;
    background-position: -203px -219px;
    width: 15px;
    height: 15px;
    cursor: pointer;
}
.map-tools .checkbox{
    margin-right: 9px;
}
input[type="checkbox"]:checked + .checkbox{
    background-position: -203px -235px;
}
.map-tools label{
    vertical-align: middle;
}
label {
    cursor: pointer;
}
.map-tools ::-webkit-input-placeholder{
    color: #b3b3b3;
    font-size:11px;
}
.map-tools ::-moz-placeholder{
    color: #b3b3b3;
    font-size:11px;
}
.map-tools :-ms-input-placeholder{
    color: #b3b3b3;
    font-size:11px;
}
.map-tools input:-moz-placeholder{
    color: #b3b3b3;
    font-size:11px;
}
/*map-tools end*/
/* past date start */
.past-date {
    padding: 5px 4px 4px;
    font-size: 12px;
}
.past-date .past-date-form {
    width: auto;
}
.past-date .input-holder {
    width: 142px;
}
.past-date .range {
    float: left;
    padding-right: 0 !important;
}
.past-date .date .calendar-btn {
    position: absolute;
    top: -1px;
    right: -1px;
    padding: 5px 4px 6px 5px;
    border: 1px solid #999
}
.past-date .calendar-btn i {
    background-position: -209px -334px;
}
.past-date .submit {
    float: right;
    margin-left: 3px;
    padding: 5px 11px;
    border-top: none;
}
/*.past-date .submit:hover {*/
/*background: #20527d;*/
/*border-color: #1c4365;*/
/*}*/
.past-date .submit span {
    cursor: pointer;
}

.past-date input[type=text] {
    padding: 5px 0 4px 7px !important;
    /*height: auto !important;*/
}

.past-date .input-holder .remove-btn {
    left: 82%;
    visibility: hidden;
}

/* past date end */
/*user-menu start*/
.user-menu{
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    /*height: 100%;*/
}
.user-menu .categories .tooltip .line{
    position: absolute;
    display: block;
    background: #fff;
    top: 0;
    left: 40px;
    width: 1px;
    height: 100%;
    margin: 0;
}
.user-menu .categories li:hover .tooltip,
.user-menu .categories li.pressed:hover .tooltip,
.user-menu .categories li.active:hover .tooltip{
    background: #6ab0de;
    color: #fff;
}
.user-menu .categories .user-profile:hover .tooltip i {
    background-position: -231px -308px;
}
.user-menu .categories .proximity:hover .tooltip i {
    background-position: -280px -377px;
}
.user-menu .categories li{
    position: relative;
    border-bottom: 1px solid #b3b9ba;
    width: 40px;
    height: 40px;
    cursor: pointer;
}
.user-menu .categories .geo-zones:hover i,
.user-menu .categories .geo-zones.active:hover i {
    background-position: -274px -219px;
}
.user-menu .categories .geo-zones.active i {
    background-position: -121px -347px;
}
.user-menu .categories .reports:hover i,
.user-menu .categories .reports.pressed:hover i{
    background-position: -256px -241px;
}
.user-menu .categories .reports.pressed i {
    background-position: -167px -380px;
}
.user-menu .categories {
    background: #dfe6eb;
    float: left;
}
.user-menu .categories li:last-child{
    border: none;
}
.user-menu .categories i{
    position: absolute;
    display: block;
    cursor: pointer;
}
.user-menu .categories .tooltip{
    position: absolute;
    top: 0px;
    left: 0px;
    overflow: hidden;
    text-decoration: none;
}
.user-menu .categories li.active .tooltip,
.user-menu .categories li.pressed .tooltip{
    background: #6ab0de;
}
.user-menu .categories li.admin:hover i {
    background-position: 0 -325px;
}
.user-menu .categories li .tooltip{
    background: #dfe6eb;
}
.user-menu .categories li .tooltip{
    -webkit-transition: background-color 800ms ease-out 0s;
    -moz-transition: background-color 800ms ease-out 0s;
    -o-transition: background-color 800ms ease-out 0s;
    transition: background-color 800ms ease-out 0s;
    padding: 8px 10px 0 8px;
    color: #586974;
}
.user-menu .categories .mapping .tooltip{
    padding: 8px 10px 0 8px;
    color: #586974;
}
.user-menu .categories .tooltip .login-info,
.user-menu .categories .tooltip .logout-frame>span{
    position: static;
    margin: 0;
    display: block;

}
.user-menu .categories .tooltip .username,
.user-menu .categories .tooltip .login-info,
.user-menu .categories .tooltip .logout-frame>span{
    font-size: 11px;
}
.user-menu .categories .tooltip .logout-frame{
    top: -4px;
    overflow: hidden;
    height: 29px; /* - */
    display: block;
}
.user-menu .categories .tooltip span,
.user-menu .categories .tooltip .logout-frame {
    position: relative;
    left: -11px;
    margin-left: 55px;
    font-size: 14px;
    font-size-adjust: 0.5;
    color:#fff;
    white-space: nowrap;
}
.user-menu .categories li.active .tooltip span,
.user-menu .categories li.pressed .tooltip span {
    color: #fff;
}
.user-menu .categories .tooltip .logout-frame a{
    text-decoration: none;
    color:#fff;
}
.user-menu .categories .tooltip .logout-frame span{
    position: static;
}
.user-menu .categories .tooltip .username{
    color: #fff;
    left: 0;
    margin:0;
}
.user-menu .categories .mapping i{
    width: 19px;
    height: 17px;
    background-position: -240px -459px;
}
.user-menu .categories .mapping.active i,
.user-menu .categories .mapping:hover i,
.user-menu .categories .mapping.active:hover i{
    background-position: -240px -440px;
}
.user-menu .categories .geo-zones .tooltip{
    padding: 8px 12px 0 8px;
    color: #586974;
}
.user-menu .categories .geo-zones i{
    width: 16px;
    height: 22px;
    background-position: -239px -219px;
}
.user-menu .categories .camera-events i{
    width: 22px;
    height: 17px;
    background-position: -112px -386px;
}
.user-menu .categories .camera-events:hover i,
.user-menu .categories .camera-events.active:hover i{
    background-position: -96px -440px;
}
.user-menu .categories .camera-events.active i{
    background-position: -88px -386px;
}
.user-menu .categories .alerts .tooltip {
    padding: 8px 0 0 8px;
    color: #586974;
}
.user-menu .categories .alerts .tooltip i {
    width: 16px;
    height: 18px;
    background-position: -121px -440px;
}
.user-menu .categories .alerts:hover .tooltip i,
.user-menu .categories .alerts.active:hover .tooltip i{
    background-position: -155px -440px;
}
.user-menu .categories .alerts.active .tooltip i {
    background-position: -138px -440px;
}
.user-menu .categories .camera-events .tooltip{
    padding: 8px 12px 0 8px;
    color: #586974;
}
.user-menu .categories .reports .tooltip{
    padding: 8px 10px 0 9px;
    color: #586974;
    padding: 8px 10px 0 9px;
    color: #586974;
}
.user-menu .categories .pressed .tooltip .svg-menu-icon,
.user-menu .categories .active .tooltip .svg-menu-icon{
    color: #fff;
}
.user-menu .categories .reports i{
    width: 17px;
    height: 20px;
    background-position: -256px -219px;
}
.user-menu .categories .reports.active i{
    background-position: -167px -380px;
}
.user-menu .categories .sms .tooltip {
    padding: 8px 10px 0 9px;
    color: #586974;
}
.user-menu .categories .sms i {
    top: 12px;
    width: 21px;
    height: 19px;
    background-position: -173px -439px;
}
.user-menu .categories .active.sms i {
    background-position: -195px -439px;
}
.user-menu .categories .sms .tooltip:hover i,
.user-menu .categories .sms i:hover,
.user-menu .categories .sms.active i,
.user-menu .categories .sms .tooltip:active i{
    background-position: -195px -439px;
}
.user-menu .categories .vehicle-checks .tooltip{
    padding: 8px 12px 0 9px;
    color: #586974;
}
.user-menu .categories .vehicle-checks i{
    width: 16px;
    height: 20px;
    background-position: -262px -459px;
}
.user-menu .categories .vehicle-checks.active i,
.user-menu .categories .vehicle-checks:hover i{
    background-position: -262px -438px;
}
.user-menu .categories .preferences .tooltip{
    padding: 11px 10px 13px 9px;
}
.user-menu .categories .preferences i{
    width: 20px;
    height: 20px;
    background-position: -295px -219px;
}
.user-menu .categories .preferences.active i{
    background-position: -295px -240px;
}
.user-menu .categories .admin .tooltip{
    padding: 8px 10px 0 8px;
    color: #586974;
}
.user-menu .categories .admin i{
    width: 20px;
    height: 17px;
    background-position: 0 -307px;
}
.user-menu .categories .admin.pressed i {
    background-position: -274px -243px;
}
.user-menu .categories .logout .tooltip{
    padding: 11px 13px 0 13px;
    color: #586974;
}
.user-menu .categories .logout i{
    width: 14px;
    height: 19px;
    background-position: -21px -307px;
}
.user-menu .categories .logout.active i{
    background-position: -21px -327px;
}
.user-menu .categories .logout.active i{
    background-position: -21px -307px;
}

.user-menu .categories .refresh .tooltip {
    vertical-align: top;
    padding: 23px 12px 0 12px;
    overflow: hidden;
}

.user-menu .categories .refresh i {
    left: 141px;
    top: 10px;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 18px;
    height: 18px;
    background-position: -98px -353px;
    white-space: nowrap;
}
.user-menu .categories .refresh.pressed:hover i {
    background-position: -98px -353px;
}
.user-menu .categories .refresh.pressed i {
    background-position: -145px -410px;
}

.user-menu .categories .tooltip .line2 {
    position: absolute;
    background: #ddd;
    top: 0;
    left: 130px;
    width: 1px;
    height: 100%;
    margin: 0;
    display: inline;
}

.user-menu .categories .tooltip .refresh_icon {
    background: #fff;
    top: 0;
    width: 147px;
    height: 100%;
    margin: 0;
    display: block;
    overflow: hidden;
}

.user-menu .categories .refresh.active .item h2,
.user-menu .categories .refresh:hover .item h2 {
    color: #fff;
}

.user-menu .categories .refresh.active .circle_animation,
.user-menu .categories .refresh:hover .circle_animation {
    stroke: #fff;
}

.user-menu .categories li.pressed .item h2 {
    color: #6ab0de;
}

.user-menu .categories .refresh .tooltip .item {
    left: 0;
    bottom: 0;
    top: 0;
    position: absolute;
    margin-left: 0;
}

.user-menu .categories .item h2 {
    font-size: 16px;
    position: absolute;
    color: #586974;
    top: -2px;
    bottom: 18px;
    left: 11px;
    width: 100%;
}

.user-menu .categories svg {
    width: 40px;
    height: 40px;
    position: absolute;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.user-menu .categories .circle_animation {
    stroke-dasharray: 95; /* this value is the pixel circumference of the circle */
    stroke-dashoffset: 0;
    transition: all 1s linear;
    r: 15;
    cx: 20;
    cy: 20;
    stroke-width: 2;
    stroke: #586974;
    fill: none;
}

.user-menu .categories li.pressed .circle_animation {
    stroke: #6ab0de;
}

/*simple-popup start*/
.simple-popup {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
    background: #fff;
    display: none;
}

.simple-popup .header-panel {
    cursor: move;
}

.simple-popup .table-drop > ul > li:last-child {
    display: table-row;
}

.simple-popup.defect-closed {
    width: 430px;
}

.simple-popup.defect-closed .comment {
    border-top: none;
}

.simple-popup.notes .note-text {
    padding: 18px 10px;
    min-width: 200px;
}

.simple-popup .section {
    padding: 14px 11px;
    border-top: 1px solid #e7e6e6;
}

.simple-popup .section.has-table-grid {
    padding: 14px 0 0 0;
}

.simple-popup .section.has-table-grid .title-wrap {
    padding-left: 11px;
}

.simple-popup .vehicle-defect-info li {
    padding-bottom: 6px;
}

.simple-popup .section:first-child {
    border-top: none;
    padding-bottom: 2px;
}

.simple-popup .section .title-wrap {
    padding-bottom: 7px;
}

.simple-popup .daily-check .status-marker {
    display: inline-block;
    width: 15px;
    height: 15px;

    vertical-align: middle;
    border-radius: 8px;
}

.simple-popup .daily-check .status-marker.checked {
    background: #0fa913;
}

.simple-popup .daily-check .status-marker.minor-defect {
    background: #ffa200;
}

.simple-popup .daily-check .status-marker.safety-critical-defect {
    background: red;
}

.simple-popup .daily-check .status-marker.not-applicable {
    background: blue;
}

.simple-popup .daily-check .hint {
    background: #fff;
    border: none;
    padding: 0;
    z-index: 1;
    max-width: 300px;
}

.simple-popup .daily-check .hint .hint-frame {
    background: #fff;
    padding: 1px 7px;
}

.simple-popup .daily-check .hint.tooltip-arrow::before,
.simple-popup .daily-check .hint.tooltip-arrow::after {
    background: #fff;
}

.simple-popup .daily-check li {
    line-height: 30px;
}

.simple-popup .daily-check span {
    vertical-align: middle;
}

/*simple-popup end*/

.simple-popup.refresh-settings {
    width: 235px;
    height: 132px;
    align: center;
}

.simple-popup.refresh-settings.tooltip-arrow::after,
.simple-popup.refresh-settings.tooltip-arrow::before {
    left: 220px;
}

.refresh-settings .input-holder.counter {
    width: 37px;
    display: inline-block;
}

.refresh-main .section {
    display: inline-block;
    vertical-align: top;
    padding-left: 10px;
}

.refresh-main .row {
    overflow: hidden;
}

.refresh-settings .btn-holder {
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 27px;
}
.user-menu .categories .user-profile .tooltip{
    padding: 8px 13px 0 8px;
    color: #586974;
}
.user-menu .categories .user-profile i{
    width: 22px;
    height: 22px;
    background-position: -255px -308px;
    margin-top: -3px;
}
.user-menu .categories .user-profile.active i{
    background-position: -207px -308px;
}

.user-menu .categories .user-profile.active:hover i{
    background-position: -231px -308px;
}
.user-menu .tab{
    position: relative;
    float: right;
    background: #fff;
    width: 200px;
    height: 100vh;
    -webkit-box-shadow: inset 8px 0px 6px -4px rgba(0,0,0,0.6);
    -moz-box-shadow: inset 8px 0px 6px -4px rgba(0,0,0,0.6);
    box-shadow: inset 8px 0px 6px -4px rgba(0,0,0,0.6);
    display: none;
    overflow: hidden;
}
.user-menu .tab:before {
    content: "";
    width: 100%;
    position: absolute;
    top: -5px;
    right: 100%;
    bottom: -5px;
    z-index: 3;
    -webkit-box-shadow: 8px 0px 6px -4px rgba(0,0,0,0.6);
    -moz-box-shadow: 8px 0px 6px -4px rgba(0,0,0,0.6);
    box-shadow: 8px 0px 6px -4px rgba(0,0,0,0.6);
}
.user-menu .tab .title{
    white-space: nowrap;
    font-size: 14px;
    position: relative;
    padding: 10px 127px 15px 10px;
    color:#586974;
    -webkit-box-shadow: inset 8px 0px 6px -4px rgba(0,0,0,0.6);
    -moz-box-shadow: inset 8px 0px 6px -4px rgba(0,0,0,0.6);
    box-shadow: inset 8px 0px 6px -4px rgba(0,0,0,0.6);
}
.user-menu .tab>ul{
    -webkit-box-shadow: inset 0px 6px 6px -4px rgba(0,0,0,0.6);
    -moz-box-shadow: inset 0px 6px 6px -4px rgba(0,0,0,0.6);
    box-shadow: inset 0px 6px 6px -4px rgba(0,0,0,0.6);
    white-space: nowrap;
}
.user-menu .tab ul li{
    padding: 6px 13px 3px 13px;
    cursor: pointer;
}
.user-menu .tab ul.account-list li{
    padding:0 0 0 8px;
}
.user-menu .tab>ul>li:hover{
    background: #dadcdd;
}
.user-menu .tab>ul.account-list>li:hover{
    background: none;
}
.user-menu .tab>ul>li:hover>a,
.user-menu .tab .account-list .account-folder:hover,
.user-menu .tab .account-list .account-folder:hover a,
.user-menu .tab .account-list .account-folder:hover .group{
    color:#000;
}
.user-menu .tab ul li a,
.user-menu .tab ul.account-list .account-folder{
    text-decoration: none;
    color: #586974;
}
/*user-menu end*/
/*proximity view start*/
.proximity-view{
    background: #fff;
    display: none;
    -moz-box-shadow: 0px 2px 2px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0px 2px 2px 1px rgba(0,0,0,0.4);
    box-shadow: 0px 2px 2px 1px rgba(0,0,0,0.4);
}
.proximity-view .title-holder{
    padding: 4px 5px 4px 6px;
    border:1px solid #b2b2b2;
    cursor: pointer;
}
.proximity-view .select .title-holder span{
    max-width: none;
}
.proximity-view .title-holder i{
    background-position: -302px -174px;
    float: right;
    width: 9px;
    height: 6px;
    margin-top: 5px;
}
.proximity-view .select.active i{
    background-position: -302px -182px;
}
.proximity .description,
.proximity-view .description{
    padding: 8px 0 2px 5px;
    font-family: Verdana;
    color: #444;
}
.proximity-view .select-holder .row .select,
.ui-selectmenu-button {
    background: #f5f6f7;
    background: -moz-linear-gradient(top,  #f5f6f7 0%, #dadcdd 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f6f7), color-stop(100%,#dadcdd));
    background: -webkit-linear-gradient(top,  #f5f6f7 0%,#dadcdd 100%);
    background: -o-linear-gradient(top,  #f5f6f7 0%,#dadcdd 100%);
    background: -ms-linear-gradient(top,  #f5f6f7 0%,#dadcdd 100%);
    background: linear-gradient(to bottom,  #f5f6f7 0%,#dadcdd 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f7', endColorstr='#dadcdd',GradientType=0 );
    position: relative;
}
.arrow-holder .arrow-down,
.arrow-holder .arrow-up {
    background: #f2f2f2;
}
.proximity-view .select-holder .row .select.active,
.ui-selectmenu-button.ui-corner-top{
    background: #fff;
}
.tabset-report-panel.proximity .proximity-view .select-holder .row,
.control-holder .proximity-view .select-holder .row {
    border: none;
    padding: 5px 0 0 0;
    overflow: visible;
}
.proximity-view .select .dropdown,
.proximity-view .search .dropdown{
    position: absolute;
    top: 25px;
    background: #fff;
    width: 100%;
    z-index: 1;
    padding-bottom: 3px;
    -webkit-box-shadow: 0px 5px 5px 1px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 5px 5px 1px rgba(0,0,0,0.3);
    box-shadow: 0px 5px 5px 1px rgba(0,0,0,0.3);
    display: none;
}
.proximity-view .select .scroll-content,
.proximity-view .search .scroll-content{
    max-height: 186px;
}
.proximity-view .select .scrollbar,
.proximity-view .search .scrollbar{
    opacity: 0.5;
    right:1px;
    top:1px;
    z-index: 1;
    display: none;
}
.proximity-view .select.active .dropdown,
.tabset-report-panel .search.active .dropdown,
.proximity-view .search.active .dropdown{
    display: block;
}
.proximity-view .select .dropdown li,
.proximity-view .search .dropdown li{
    padding: 3px 0 4px 8px;
    font-size: 11px;
}
.proximity-view .select-holder {
    padding: 0 5px 5px 5px;
}
/*proximity view end*/
/*activity view start*/
.activity-view {
    background: #fff;
    display: none;
}
.right-col.activity-active .activity-view{
    display: block;
}
.resize-activity{
    border: 1px solid #c7c7c7;
    cursor: s-resize;
    width: 322px;
}
.activity-view .scrollbar{
    right: 1px;
    z-index: 1;
    opacity: 0.5;
    display: none;
}
.activity-view table{
    width: 100%;
    border-top: 1px solid #545454;
    border-collapse: collapse;
}
.activity-view .scroll-frame table{
    border: none;
    table-layout: fixed;
}
.activity-view .scroll-frame table td{
    padding: 0;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.activity-view table th{
    position: relative;
    color: #fff;
    background: #6e6e6e;
    border-right: 1px solid #545454;
    padding: 8px 0;
}
.activity-view table th i{
    cursor: e-resize;
    position: absolute;
    top: 0;
    left: 100%;
    width: 3px;
    height: 100%;
    z-index: 1;
}
.activity-view table td{
    height: 28px;
    border-right: 1px solid #e7e6e6;
}
.activity-view .scroll-frame table tr{
    cursor: pointer;
}
.activity-view table tr:nth-child(2n+1)
{
    background:#f7f8f8;
}
.activity-view table th:last-child,
.activity-view table tr td:last-child{
    border: none;
}
.resize-activity span{
    display: block;
    margin: 2px auto;
    width: 10px;
    height: 5px;
    background-position: -302px -190px;
}
.right-col.activity-active .vehicle-holder{
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}
/*activity view end*/
/*vehicle search result popup start*/
.vehicle-search-popup {
    max-width: 920px;
    max-height: 296px;
    position: absolute;
    top: 25%;
    left: 25%;
    z-index: 1233;
    display: none;
    -webkit-box-shadow: 0 0 2px 0 rgba(0,0,0,0.3);
    -moz-box-shadow: 0 0 2px 0 rgba(0,0,0,0.3);
    box-shadow: 0 0 2px 0 rgba(0,0,0,0.3);
}
.vehicle-search-popup .table-drop>ul>li:last-child {
    display: none;
}
.advanced-activity-log.simple-popup .table-drop > ul > li:hover {
    background: #d0e4ee;
}
.advanced-activity-log.simple-popup .table-drop>ul>li:last-child {
    display: block;
}
.vehicle-search-popup .export-row,
.vehicle-search-popup .action-row {
    height: 24px;
    padding: 5px;
    background-color: #fff;
}
.vehicle-search-popup .action-row {
    border-top: 1px solid #999999;
}
.xls-btn {
    margin-left: 7px;
}
.vehicle-search-popup .scrollbar,
.search-variants-holder .scrollbar {
    position: absolute;
    right: 0;
    top: 0;
    opacity: 0.5;
    height: 100%;
    width: 10px;
    z-index: 1;
}
/*vehicle search result popup end*/
/*journey report start*/
.report {
    position: absolute;
    top: 0;
    left: 0;
    width: 85%;
    height: 100%;
    background: #fff;
    display: none;
    z-index: 1;
}
.report.journey {
    width: 92%;
}
.report .right-button-set{
    float: right;
    padding-right: 4px;
}
.report .right-button-set .button{
    display: inline-block;
}
.report .right-button-set .button:last-child{
    margin-left: 8px;
}
.report .vehicle-info .scrollbar{
    position: absolute;
    top: 0;
    right: 1px;
    width: 10px;
    height: 100%;
    opacity: 0.5;
    z-index: 1;
    display: none;
}
.report .selected-vehicles .scrollbar {
    position: absolute;
    top: auto;
    bottom: 1px;
    height: 10px;
    width: 100%;
    z-index: 1;
    display: none;
    opacity: 0.5;
}
.report .selected-vehicles .scrollbar .handle{
    height: 100%;
}
.report label {
    margin-right: 12px;
    float: right;
    line-height: 16px;
    cursor: pointer;
}
.report label .checkbox {
    margin-right: 7px;
}
.report label input[type="checkbox"] {
    display: none;
}
.report .box-shadow-frame {
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    position: relative;
    z-index: 3;
    height: 100%;
}
.report .date-holder{
    font-size: 14px;
    padding: 6px 0 7px 7px;
}
.report .header-panel .button{
    float: right;
}

.user-menu .categories .proximity .tooltip{
    padding: 10px 12px 14px 9px;
}
.user-menu .categories .proximity i {
    height: 21px;
    width: 21px;
    background-position: -280px -399px;
}
.user-menu .categories .proximity:active i {
    background-position: -280px -377px;
}
.user-menu .categories .proximity:hover i {
    background-position: -280px -399px;
}
.report .header-panel{
    padding: 4px 4px 4px 8px;
    position: relative;
    z-index: 1;
    border-bottom: 1px solid #e8e8e8;
}
.report .header-panel .title{
    line-height: 25px;
    font-size: 14px;
}
.report .slide-btn{
    width: 26px;
    height: 35px;
    background-position: -169px -174px;
    right: -26px;
    top:-2px;
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
}
.report .selected-vehicles{
    width: auto;
}
.report .vehicle-info .report-frame {
    padding-left: 0;
}
.report .vehicle-info .vehicle-panel{
    padding: 0 0 8px 7px;
    color: #586974;
}
.report .vehicle-info .day-section .day-info{
    padding: 30px 0 7px 7px;
    color: #586974;
}
.report .vehicle-info .vehicle-panel+.day-section .day-info{
    padding-top: 0;
}
.report .vehicle-info .vehicle-panel span:last-child{
    padding-left: 11px;
}

.report.modal .table-drop {
    position: fixed;
}

.report.modal {
    width: 100%;
}

.report.modal .header-panel {
    border-bottom: none;
}

.report.modal .header-panel .button {
    float: none;
    display: inline-block;
}

.report.modal .scrollbar.vertical {
    top: 0;
    bottom: 0;
    right: 1px;
    width: 10px;
    height: 100%;
    opacity: 0.5;
    z-index: 1;
    display: none;
}

table.info, table.search-result {
    width: 100%;
    border-top: 1px solid #999;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    border-bottom: 1px solid #999;
}
.manage-drivers table.info {
    border-bottom: none;
}
/* fix double border */
.scroll-content table.info,
.scroll-content table.search-result {
    border-top: 0;
}

/* fix table.info border-top */
.report .scroll-content table.info {
    border-top: 1px solid #999;
}
table.info tbody tr.active {
    background: #d0e4ee;
}
table.info .table-icon,
table.search-result .table-icon {
    float: right;
    padding-right: 5px;
}
.report .vehicle-info .row:first-child{
    padding-top: 0;
}
.report .vehicle-info .row{
    padding-top: 24px;
}
table.search-result .bolder {
    font-weight: bold;
}
table.info th, table.search-result th {
    position: relative;
    color: #586974;
    background: #d6e7f3;
    border-right: 1px solid #b2b8bc;
    padding: 8px 0 8px 11px;
    text-align: left;
    font-weight: normal;
}
table.info.alerts td:last-child {
    border-right: 1px solid #b2b8bc;
}
table.info.alerts th:first-child{
    border-left: 1px solid #b2b8bc;
}
table.info.alerts th:last-child {
    border-right: 1px solid #b2b8bc;
}
table.info th:first-child{
    /*border-left: 1px solid #9b9999;*/
}
table.info th:last-child{
    border-right: 1px solid #b2b8bc;
}
table.info.content .delete,
table.info.content .edit{
    display: inline-block;
}
table.info.content tr .delete{
    background-position: -172px -321px;
}
table.info.content tr:hover .delete{
    background-position: -172px -339px;
}
table.info.content tr:hover .delete:hover{
    background-position: -172px -357px;
}
table.info.content tr:hover .edit{
    background-position: -154px -336px;
}
table.info.content tr:hover .edit:active,
table.info.content tr.active .edit {
    background-position: -154px -353px;
}
table.info.content tr:hover .edit{
    background-position: -154px -336px;
}
table.info.content .edit{
    width: 16px;
    height: 16px;
    background-position: -154px -319px;
}
table.info.content .delete{
    width: 15px;
    height: 17px;
    background-position: -211px -309px;
}
table.info.content tr:hover .edit{
    background-position: -154px -336px;
}
table.info.content tr:hover .edit:hover{
    background-position: -154px -353px;
}
table.info.content tr:hover .edit:active,
table.info.content tr.active .edit{
    background-position: -154px -353px;
}
table.info.content tr:hover .delete{
    background-position: -172px -339px;
}
table.info.content tr:hover .delete:hover{
    background-position: -172px -357px;
}
table.info.content .button{
    display: inline-block;
}
table.info.content td.with-button,
table.info.content td.with-ico{
    text-align: center;
}
table.info.content td.with-ico{
    padding: 0;
}
.advanced-activity-log table.info.content td.with-ico {
    padding: 7px 0 8px 11px;
}
table.info.content td.with-button{
    padding: 3px 0 3px 0;
}
.report .vehicle-info table .add-poi{
    position: relative;
}
.report .vehicle-info table .add-poi .hidden-btn,
.report .vehicle-info table .add-poi .hidden-btn .bg{
    position: absolute;
}
.report .vehicle-info table .add-poi .hidden-btn span{
    position: relative;
}
.report .vehicle-info table .add-poi:hover .hidden-btn{
    display: none;
}
.report .vehicle-info table .add-poi .hidden-btn{
    top: 4px;
    right: 3px;
    border: 1px solid #1a1d1f;
    padding: 4px 9px;
    font-size: 10px;
    color:#fff;
    display: none;
    cursor: pointer;
}
.report .vehicle-info table .add-poi .hidden-btn .bg{
    top: 0;
    left: 0;
    background: #4a4e53;
    height: 100%;
    width: 100%;
    opacity: 0.8;
}
table.info th:hover, table.search-result th:hover {
    color: #6ab0de;
    background: #e9f1f7;
}
table.info th:last-child, table.search-result th:last-child {
    border:  none;
}
table.info th.complex-header{
    border-bottom: 1px solid #b2b8bc;
    text-align: center;
}
table.info td, table.search-result td {
    padding: 7px 0 8px 11px;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-right: 1px solid #b2b8bc;
    color:#586974;
}
table.info td:first-child{
    /*border-left: 1px solid #9b9999;*/
}
table.search-result th,
table.search-result td {
    padding-left: 5px;
    padding-right: 2px;
}
table.info td.with-checkbox .checkbox{
    float: none;
    display: inline-block;
}
table.info td:empty{
    height: 14px;
}
table.info td img{
    display: inline-block;
    /*margin: 0 auto;*/
}
.journey-details-popup table.info td img{
    height: 18px;
    width: 18px;
}
table.info tr, table.search-result tr {
    background: #fff;
    cursor: pointer;
}
table.info tr.empty-row{
    cursor: default;
}
table.info tr:nth-child(2n+1){
    background: #f7f8f8;
}
table.info tr:hover, table.search-result tr:hover, table.search-result tr.active {
    background: #ceeafd !important;
}
table.info tr:hover td,
table.search-result tr.active,
table.info tbody tr.active td{
    color: #586974;
}
/*journey report end*/
/* add drop start*/
.add-drop{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 123;
    background: #fff;
    display: none;
}
.add-drop form{
    background: #fff;
    padding: 5px 8px 9px 7px;
}
.add-drop .arrow-holder .arrow-up:hover i{
    background-position: -117px -245px;
}
.add-drop .arrow-holder .arrow-down:hover i{
    background-position: -117px -250px;
}
.add-drop .arrow-holder .arrow-up i,
.add-drop .arrow-holder .arrow-down i{
    width: 6px;
    height: 4px;
    display: block;
}
.add-drop .arrow-holder{
    background: #f4f4f4;
    border-left: 1px solid #dedede;
}
.add-drop .arrow-holder .arrow-up i{
    background-position: -111px -245px;
}
.add-drop .arrow-holder .arrow-down i{
    background-position: -111px -250px;
}
.add-drop .arrow-holder .arrow-up,
.add-drop .arrow-holder .arrow-down{
    cursor: pointer;
}
.add-drop .arrow-holder .arrow-up{
    padding: 4px 4px 3px 4px;
    border-bottom: 1px solid #c6c6c6;
}
.add-drop .arrow-holder .arrow-down{
    padding: 3px 4px 4px 4px;
}
.add-drop .input-holder input{
    padding: 5px 0 4px 0;
    font-size: 11px;
}
.add-drop .row{
    overflow: hidden;
    display: table-row;
}
.add-drop fieldset{
    border-spacing: 0 5px;
}
.add-drop .row > span{
    padding-right: 37px;
    display: table-cell;
}
.add-drop span.title{
    padding-bottom: 12px;
}
.add-drop .lon,
.add-drop .lat{
    color: #6b6b6b;
}
.add-drop .button-holder{
    overflow: hidden;
    padding-top: 8px;
}
.add-drop .input-holder{
    border: 1px solid #dddddd;
    position: relative;
    webkit-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    padding-left: 6px;
    cursor: text;
}
.add-drop .select-holder,
.add-drop .input-holder{
    display: table-cell;
    width: 190px;
}
.add-drop .button.submit{
    float: right;
}
/* add drop end*/
/* add information popup */
#addInformation .info-action {
    display: inline;
}

.add-information-popup {
    position: absolute;
    width: 280px;
    left: 333px;
    top: 169px;
    background-color: #fff;
    z-index: 10;
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
}
.add-information-popup.edit-info {
    z-index: 110;
}
.add-information-popup .before {
    content: "";
    position: absolute;
    top: 9px;
    width: 0;
    height: 0;
    box-sizing: border-box;
    border: 5px solid #dfe6eb;
    border-color: transparent transparent rgb(40, 43, 43)rgb(40, 43, 43);
    -webkit-box-shadow: -2px 2px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: -2px 2px 2px 0px rgba(0,0,0,0.3);
    box-shadow: -2px 2px 2px 0px rgba(0,0,0,0.3);
    transform-origin: 0 0;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.add-information-popup .header-panel .info-for,
.add-information-popup .header-panel .info-action {
    display: inline;
}
.add-information-popup .add-info-input {
    padding: 10px 10px 25px;
    height: 20px;
    border-bottom: 1px solid grey;
}
.add-information-popup .add-info-input label {
    line-height: 20px;
}
.add-information-popup .add-info-input input {
    float: right;
    border: 1px solid grey;
    line-height: 20px;
    margin-top: -1px;
    width: 162px;
    font-size: 12px;
    padding: 0 7px;
    box-shadow: inset 0 0 3px 0 #666;
}
.add-information-popup .add-info-input .add-info-description {
    content: "";
    clear: both;
    float: right;
    color: #999;
    font-size: 10px;
    margin-top: 3px;
}
.add-information-popup .add-example {
    padding: 10px;
}
.add-information-popup .add-example span {
    line-height: 12px;
    color: #999999;
    font-size: 10px;
}
.add-information-popup .action-row {
    padding: 0 10px;
}
.add-information-popup .action-panel .button {
    margin-bottom: 10px;
}
/* end add information popup*/
/* add single poi start */
.add-poi-popup {
    position: absolute;
    transition: background 0.7s;
    background: #2c2c2c;
    width: 40px;
    height: 40px;
    display: none;
    cursor: pointer;
    z-index: 10;
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
}

.add-poi-popup .after {
    content: "";
    position: absolute;
    left: 20px;
    bottom: -3px;
    width: 0;
    height: 0;
    background: transparent;
    box-sizing: border-box;
    border: 5px solid #000;
    border-color: transparent #1f2121 #1f2121 transparent;
    transition: border-color 0.7s;
    -webkit-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.3);
    box-shadow: 1px 1px 1px 0px rgba(0,0,0,0.3);
    transform-origin: 0 0;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

/*.add-poi-popup .button.save {*/
/*!*cursor: pointer;*!*/
/*}*/

.add-poi-popup .button.save:active ~ .after {
    border-color: transparent #dadcdd #dadcdd transparent;
}

.add-poi-popup .add-poi-btn i {
    width: 16px;
    height: 22px;
    background-position: -239px -219px;
    left: 11px;
    bottom: 7px;
    z-index: 11;
    position: absolute;
    display: block;
    cursor: pointer;
}

.add-poi-popup .add-poi-tooltip {
    visibility: hidden;
    opacity: 0;
    transition: opacity 1s;
    position: absolute;
    left: 40px;
    width: 190px;
    padding: 0 10px;
    border-left: 1px solid #c8c8c8;
    background-color: #dadcdd;
    color: #000;
    line-height: 40px;
}

.add-poi-popup:hover {
    background: #dadcdd;
    transition: background 0.7s;
}

.add-poi-popup:hover > .add-poi-btn i {
    background-position: -274px -219px;
}

.add-poi-popup:hover > .after {
    border-color: transparent #dadcdd #dadcdd transparent;
    /*transition: border-color 0.7s;*/
}

.add-poi-popup:hover > .add-poi-tooltip {
    visibility: visible;
    opacity: 1;
    transition: opacity 1s, visibility 1s;
}
/* add single poi end */
/*journey details popup start*/
.journey-details-popup {
    height: auto !important;
    width: 658px;
    max-height: 490px;
    position: absolute;
    top: 25%;
    left: 25%;
    z-index: 1233;
    display: none;
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
}
.journey-details-popup .info-holder{
    border-bottom: 1px solid #999;
}
.journey-details-popup td:last-child{
    width: 39px !important;
}
.journey-details-popup th:last-child{
    width: 46px !important;
}
.journey-details-popup table.info td{
    padding: 7px 7px 8px 11px;
}
.journey-details-popup table.info{
    border-bottom: none;
}
.journey-details-popup .scrollbar{
    position: absolute;
    top: 0;
    right: 1px;
    width: 10px;
    height: 100%;
    opacity: 0.5;
    z-index: 1;
    display: none;
}

table.info td:last-child{
    border-right: 0;
}
.journey-details-popup .header-panel,
.vehicle-search-popup .header-panel {
    padding: 4px 5px 3px 10px;
    cursor: move;
}
.journey-details-popup .header-panel .title,
.vehicle-search-popup .header-panel .title {
    font-size: 14px;
}
/*journey details popup end*/
/*modal popup start*/
.modal-popup{
    position: absolute;
    top: -0.5px;
    left: 0;
    z-index: 3;
    background: white;
    color:#444444;
    display: none;
    -webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.3);
}
.modal-popup .header-panel{
    border-bottom: 1px solid #d0d0d0;
}
.modal-popup .title{
    font-size: 14px;
    line-height: 24px;
}
/*modal popup end*/
/*journey report popup start*/
.report-popup {
    position: absolute;
    top: 20px;
    left: 400px;
    width: 461px;
    background: white;
    color:#586974;
    display: none;
    z-index: 1;
    -webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.3);
}
.report-popup.idling-fuel-usage{
    width: 543px;
}
.report-popup .header-panel,
.ooi-list-popup .header-panel {
    cursor: move;
}
.report-popup .scrollbar{
    position: absolute;
    top: auto;
    bottom: 1px;
    height:10px;
    width:100%;
    opacity:0.5;
    z-index: 1;
}
.report-popup .scrollbar .handle{
    height:100%;
}
.header-panel{
    padding: 4px 5px 4px 8px;
    overflow: hidden;
}
.header-panel .title{
    color: #586974;
    line-height: 24px;
}
.report-popup .header-panel .title{
    font-family: Verdana;
}
.report-popup .selected-vehicles{
    width: 461px;
    overflow: hidden;
    max-height: 100px;
}
.report-popup.idling-fuel-usage .selected-vehicles{
    width: 543px;
}
.report-popup.journey .selected-vehicles{
    width: 461px;
}
.report-popup.idling-fuel-usage .selected-vehicles {
    width: 543px;
}
.report-frame {
    border-top: 1px solid #9b9999;
    padding: 10px 0 0 9px;
}
.tab.proximity .button-wrap .title span,
.proximity .report-frame .title span,
.location-report-view .title span,
.report-frame .title span{
    color: #202222;
    font-size: 14px;
    padding-right: 6px;
    font-weight: bold;
}
.vehicle-list{
    padding: 9px 0 7px 0;
    overflow: hidden;
}
.vehicle-list li{
    float: left;
    padding-left: 26px;
}
.vehicle-list li:last-child{
    padding-right: 26px;
}
.vehicle-list span{
    display: block;
    padding-top: 2px;
    color: #586974;
}
.selected-vehicles .report-frame {
    padding-left: 0;
}
.report-wrap {
    padding: 0 0 8px 17px;
}
.proximity .report-frame .title,
.proximity .button-wrap>.title,
.location-report-view .title,
.selected-vehicles .title{
    padding-left: 9px;
    color: #586974;
}
.report-popup .row{
    overflow: hidden;
}
.report-popup .date-range .row{
    padding-top: 7px;
}
.report-popup .section{
    display: inline-block;
    vertical-align: top;
}
.report-popup .idling-filter .select-holder{
    padding: 0 20px;
}
.report-popup .idling-filter .input-holder.counter input{
    width: 30px;
}
.report-popup .idling-filter .input-holder.counter{
    display: inline-block;
}
.report-popup .format .row:first-child{
    padding-top: 12px;
}
.report-popup .btn-holder{
    padding: 11px 9px 8px 10px;
    overflow: hidden;
}
.report-popup .date-range input{
    height: 10px;
}
.report-popup .date-range .range:first-child{
    padding-right: 14px;
}

.range:first-child{
    padding-right: 14px;
}
.report-popup .date-range .button-list li{
    padding-right: 8px;
    float:left;
}
.report-popup .date-range .calendar-btn{
    position: absolute;
    top: 0;
    right: 0;
    padding: 6px 5px;
    /*border: 1px solid #dadada;*/
}
.calendar-btn i{
    display: block;
    width: 13px;
    height: 13px;
    background-position: -70px -308px;
}
.calendar-btn:hover i {
    background-position: -209px -334px;
}
.advanced-activity-log .calendar-btn:hover i {
    background-position: -85px -308px;
}
.advanced-activity-log .calendar-btn.active i {
    background-position: -209px -334px;
}
.report.smart-witness-camera .calendar-btn:hover i {
    background-position: -85px -308px;
}
.calendar-btn.active{
    border-color: #262929;
    background: #6ab0de;
}
.calendar-btn.active i{
    background-position: -85px -308px;
}
.report-popup .date{
    padding-left: 13px;
}
.report-popup .date input{
    width: 67px;
    padding: 7px 33px 7px 9px;
}
.report-popup .time input{
    width:33px;
    padding: 7px;
}
.report-popup .time{
    padding-left: 8px;
}
.report-popup .date-range .range span{
    line-height: 23px;
}
.button,
.close-btn{
    color: #fff;
    position: relative;
    padding: 4px 12px;
    border:1px solid #262828;
    cursor: pointer;
}
.button {
    background: #6ab0de;
    border: 1px solid #609cc3;
}
.button:hover,
.button:active {
    border-color: #407293;
    background: #4d83a7;
}
.button:active span {
    color: #012a3b;
}
.map-tools .search-btn:hover,
.map-tools .search-btn:active {
    border: none;
}

.map-tools .submit {
    border: none;
}

.button:active{
    color:#a20000;
}
.button .side-arrow{
    float: right;
    width: 6px;
    height: 9px;
    margin: 2px 0 0 8px;
    background-position: -229px -307px;
}
.button:hover .side-arrow,
.button.with-arrow.active .side-arrow{
    background-position: -229px -317px;
}
.button.disabled,
.button:hover.disabled,
.button:active.disabled{
    color: #b6d8e6 !important;
    background: #6ab0de;
    border-color: #609cc3;
    cursor: default;
}
.button.with-arrow.active{
    color: #df4444;
}
.button.with-arrow.active{
    background: #f4f4f4;
    border-color: #dedede;
}
.button.cancel{
    float: left;
}
.button.save,
.button.delete-polygon{
    float: right;
}
.button.btn-disabled {
    pointer-events: none;
    color: #98b4c0;
}
.header-panel .button{
    color: #fff;
}
/*.header-panel .button:active,*/
/*.header-panel .button.active{*/
    /*background: #0092cc;*/
    /*color: #fff;*/
/*}*/
.report-popup .btn-holder .button.generate{
    float: right;
}
.report-popup .date-range .range,
.report-popup .date-range .range span,
.report-popup .date-range .date,
.report-popup .date-range .time{
    float:left;
    overflow: hidden;
}
.report-popup .date-range .date{
    position: relative;
}
.report-popup input[type="checkbox"]{
    display: none;
}
.report-popup .checkbox{
    margin-right: 6px;
}
.report-popup .date-range .row label{
    color: #586974;
    float: left;
    padding-right: 53px;
    cursor: pointer;
}
.report-popup .format .row label span:last-child{
    line-height: 18px;
    padding-left: 6px;
}
.report-popup .format .radio{
    margin: 2px 11px 0 0;
}
.report-popup .format .row label{
    margin-right: 20px;
    cursor: pointer;
}
.report-popup .format .row label,
.report-popup .format .row label img
{
    float:left;
}
.report-popup .date-range .row .input-holder{
    webkit-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    border: 1px solid #dadada;
}

.report-popup .modal .header .title,
.report-popup .modal .header-panel .title {
    font-size: 12px;
}

.close-btn,
.cancel-btn,
.show-group-btn,
.max-min_btn,
.max-min_btn.active {
    cursor: pointer;
    border:1px solid #262828;
    padding: 5px;
    float: right;
    margin-left: 7px;
}
.minimize .max-min_btn.active i{
    background-position: -221px -440px;
}
.close-btn,
.max-min_btn,
.max-min_btn.active {
    border: none;
}
.close-btn:hover i {
    background-position: -56px -359px;
}
.close-btn:active i {
    background-position: -137px -389px;
}
.cancel-btn {
    float: left;
    margin-left: 0;
    padding: 5px 12px;
    text-align: center;
}
.close-btn i{
    width: 12px;
    height: 12px;
    display: block;
    background-position: -56px -308px;
}
/*.close-btn:active{*/
    /*border-color: #b2b2b2;*/
/*}*/
/*.close-btn:active i{*/
    /*background-position: -56px -321px;*/
/*}*/

/*.close-btn:hover i,*/
/*.close-btn:active i{*/
    /*background-position: -56px -358px;*/
/*}*/
.max-min_btn i, .max-min_btn.active i {
    width: 12px;
    height: 12px;
    display: block;
}
.max-min_btn i {
    background-position: -2px -364px;
}
.max-min_btn i:hover,
.max-min_btn i:active {
    background-position: -16px -364px;
}
.max-min_btn.active i {
    background-position: -2px -350px;
}
.max-min_btn.active i:hover,
.max-min_btn.active i:active {
    background-position: -16px -350px;
}
.report-popup input[type="radio"]{
    display: none;
}
input[type="radio"]:checked + .radio{
    background-position: -85px -322px;
}
.radio{
    width: 15px;
    height: 15px;
    float: left;
    background-position: -101px -308px;
}
/*journey report popup end*/
/*ui-datepicker start*/
.ui-datepicker{
    display: none;
}
.ui-datepicker-header{
    background: #6ab0de;
    overflow: hidden;
    padding: 9px;
}
.ui-datepicker-calendar{
    border-collapse: collapse;
    width: 100%;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
}
.ui-datepicker-title{
    color:#fff;
    font-weight: bold;
    line-height: 18px;
    font-size: 14px;
    text-align: center;
}
.ui-datepicker-calendar thead{
    background: #fafafa;
}
.ui-datepicker-calendar th{
    padding: 6px;
    color: #b9b9b9;
}
.ui-datepicker-calendar td{
    background: #fff;
    border: 1px solid #d9d9d9;
    width: 30px;
    height: 30px;
    text-align: center;
    font-weight: bold;
    padding: 0;
}
.ui-datepicker-calendar td:hover{
    background: #ececec;
}
.ui-datepicker-calendar td.ui-datepicker-current-day{
    background: #6ab0de;
}
.ui-datepicker-calendar td.ui-datepicker-current-day{
    border-left: 1px solid #a82e2e;
}
.ui-datepicker-calendar td.ui-datepicker-current-day a{
    color:#fff;
}
.ui-datepicker-calendar td a{
    color:#1b1a18;
}
.ui-datepicker-calendar td.ui-datepicker-other-month{
    color:#787776;
}
.ui-datepicker-calendar td:first-child{
    border-left: none;
}
.ui-datepicker-calendar td:last-child{
    border-right: none;
}
.ui-datepicker-calendar tr:last-child td{
    border-bottom: none;
}
.ui-datepicker-calendar a{
    text-decoration: none;
}
.ui-datepicker-prev{
    float: left;
}
.ui-datepicker-next{
    float: right;
}
.ui-datepicker-prev .ui-icon,
.ui-datepicker-next .ui-icon{
    width: 12px;
    height: 18px;
    display: block;
    text-indent: -9999px;
    opacity: 0.2;
    cursor: pointer;
}
.ui-datepicker-prev .ui-icon:hover,
.ui-datepicker-next .ui-icon:hover{
    opacity: 1;
}
.ui-datepicker-prev .ui-icon{
    background-position: -101px -324px;
}
.ui-datepicker-next .ui-icon{
    background-position: -117px -308px;
}
.ui-datepicker-trigger{
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    cursor: pointer;
    opacity: 0;
}
.ui-datepicker-unselectable.ui-state-disabled  {
    background: #d9d9d9;
    cursor: not-allowed;
}
.ui-datepicker-line{
    position: absolute;
    top: 1px;
    left: 0;
    height: 24px;
    width: 1px;
}
/*ui-datepicker end*/
/*table icon start*/
.table-icon.asc i,
.table-icon.desc i,
.table-icon.filter i{
    display: block;
    margin: 0 auto;
}
.table-icon.asc i{
    background-position: -70px -336px;
}.table-icon.desc i{
     background-position: -114px -327px;
 }
.table-icon.filter i{
    background-position: -132px -318px;
}
.table-icon.asc i,
.table-icon.desc i{
    width: 17px;
    height: 10px;
}
.table-icon.filter i{
    width: 10px;
    height: 10px;
}
li:hover .table-icon.asc i,
.table-icon.asc.active i{
    background-position: -147px -307px;
}
li:hover .table-icon.desc i,
.table-icon.desc.active i{
    background-position: -132px -329px;
}
li:hover .table-icon.filter i,
.table-icon.filter.active i{
    background-position: -143px -318px;
}
/*table icon end*/
/*table drop start*/
.table-drop{
    position: absolute;
    top: 0;
    left: 0;
    width: 114px;
    background: #fff;
    z-index: 10000;
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    display: none;
}
.table-drop>ul{
    border-collapse: collapse;
    overflow: hidden;
}
.table-drop>ul>li{
    display: table-row;
    cursor: pointer;
}
/*.table-drop>ul>li:last-child{*/
/*    display: none;*/
/*}*/
.table-drop>ul>li:hover,
.table-drop>ul>li:hover {
    background: #d0e4ee;
    color: #586974;
}
.table-drop .top-border{
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height:1px;
    display: none;
    background: #666;
}
.table-drop>ul>li:hover .top-border{
    display: block;
}
.table-drop>ul>li>span,
.table-drop>ul>li .title{
    display: table-cell;
    font-size: 11px;
    color:#424242;
}
.table-drop .icon-wrap{
    padding: 6px;
}
.table-drop>ul>li>span:first-child{
    padding: 6px 7px 8px 4px;
    position: relative;
}
.table-drop>ul>li .title{
    padding-right: 4px;
}
.table-drop .table-sub-drop{
    position: absolute;
    top: 48px;
    left: 112px;
    background: #fff;
    padding: 7px;
    width: 153px;
    display: none;
    color: #000;
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
}
.table-drop .table-sub-drop>ul>li{
    padding-bottom: 8px;
}
.table-drop .table-sub-drop li span{
    white-space: nowrap;
}
.table-drop .table-sub-drop .select-holder,
.table-drop .table-sub-drop .input-holder{
    margin-bottom: 8px;
    margin-top: 3px;
}
.table-drop .table-sub-drop .button.filter{
    float:left;
}
.table-drop .table-sub-drop .button.clear{
    float: right;
}
.table-drop>ul>li:hover .table-sub-drop{
    display: block;
}
.table-drop .table-sub-drop .alert_select-holder {
    margin: 5px 0;
}
.table-drop .table-sub-drop .alert_input-holder {
    margin: 0 0 5px;
}
.table-drop .table-sub-drop .select-holder,
.table-drop .table-sub-drop .input-holder {
    margin-bottom: 8px;
    margin-top: 3px;
}
/*table drop end*/
/*tooltip start*/
.table-tooltip {
    position: absolute;
    top: 0;
    left: 0;
    background: #fff2e7;
    color: #956e59;
    border: 1px solid #e4d3b8;
    padding: 2px 8px 3px 8px;
    font-size: 10px;
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    display: none;
}
/*tooltip end*/
/*selectmenu start*/
.ui-selectmenu-menu {
    padding: 0;
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    background: #fff;
    -webkit-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.3);
}
.ui-selectmenu-text,
.proximity-view .title-holder span{
    white-space: nowrap;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 230px;
}
.ui-selectmenu-menu .scroll-frame{
    max-height: 200px;
    overflow: hidden;
}
.ui-selectmenu-menu ul li{
    padding: 3px 4px 5px 4px;
    cursor: pointer;
    color: #586974;
}
.ui-selectmenu-menu li:hover{
    background: #d0e4ee;
}
.ui-selectmenu-button{
    display: block;
    padding: 5px 5px 3px 4px;
    border:1px solid #ccc;
    outline:none;
    cursor: pointer;
    color: #586974;
    background: #fff;
}
.ui-selectmenu-button .ui-icon{
    float: right;
    width: 9px;
    height: 6px;
    background-position: -165px -308px;
    margin-top: 5px;
}
.ui-selectmenu-button.ui-corner-top .ui-icon{
    background-position: -302px -182px;
}
.ui-selectmenu-open {
    display: block;
}
.ui-front {
    z-index: 1000000;
}
/*selectmenu end*/
/*activity log start*/
.activity-log{
    position: absolute;
    top: 0;
    left: 0;
    width: 500px;
    height: 50%;
    background: #fff;
    display: none;
    z-index: 1;
    overflow: hidden;
    -webkit-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 4px 0px rgba(0,0,0,0.5);
}
.activity-log table.info th:first-child{
    width: 45px !important;
    border-left: 1px solid #999;
}
.activity-log table.info th:last-child{
    width: 50px !important;
    border-right: 1px solid #999;
}
.activity-log .info-holder > table.info{
    border-bottom: none;
}
.activity-log .message{
    text-align: center;
    display: none;
    margin-top: 40%;
}
.activity-log table.info.content{
    border-top: none;
}
.activity-log table.info td {
    padding: 7px 7px 8px 11px;
}
.activity-log .info-holder > table.info{
    border-top: none;
}
.activity-log .header-panel{
    cursor: move;
    border-bottom: 1px solid #494949;
}
.activity-log .header-panel .close-btn{
    cursor: pointer;
}
.activity-log .header-panel .title{
    line-height: 22px;
    font-family: Verdana;
}
.activity-log .scrollbar {
    position: absolute;
    top: 0;
    right: 1px;
    width: 10px;
    height: 100%;
    opacity: 0.5;
    z-index: 1;
    display: none;
}
.activity-log table.info img{
    float: left;
}
.activity-log table.info.content td:first-child{
    border-left: 1px solid #999;
}
.activity-log table.info img:first-child{
    padding-right: 5px;
}
/*activity log end*/
.hide-shadow {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}
.incident-details{
    display: none;
}
.inner-logo {
    display: none !important;
}
.company-logo, .inner-logo {
    position: fixed;
    z-index: 1;
}
.company-logo{
    top: 26%;
    left: 50%;
    margin-left: -213px;
}
.inner-logo{
    bottom: 40px;
    right: 41px;
}
/*today's journeys start*/
.todays-journeys{
    position: absolute;
    top: 0;
    left: 0;
    height: auto;
    width: 1269px;
    background: #fff;
    display: none;
    z-index: 1;
}
.todays-journeys .slide-button{
    padding: 9px 8px 9px 12px;
}
.todays-journeys .box-shadow-frame > table.info{
    border-bottom: none;
}
.todays-journeys table.info td:last-child{
    width: 79px !important;
}
.todays-journeys table.info th:last-child{
    width: 86px !important;
}
.todays-journeys table.info.content{
    border-top: none;
}
.todays-journeys table.info td {
    padding: 7px 7px 8px 11px;
}
.todays-journeys label {
    margin-right: 12px;
    float: right;
    line-height: 16px;
    cursor: pointer;
    color: #fff;
}
.todays-journeys .header-panel{
    font-family: Verdana;
    padding: 6px 5px 5px 8px;
}
.todays-journeys .header-panel .title-frame{
    line-height: 15px;
    padding-top: 3px;
}
.todays-journeys label .checkbox{
    margin-right: 7px;
}
.todays-journeys label input[type="checkbox"]{
    display: none;
}
.todays-journeys .scrollbar {
    position: absolute;
    top: 0;
    right: 1px;
    width: 10px;
    height: 100%;
    opacity: 0.5;
    z-index: 1;
    display: none;
}
.todays-journeys .slide-btn{
    position: absolute;
    width: 26px;
    height: 35px;
    background-position: -179px -307px;
    right: -26px;
    top: 0px;
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    z-index: 2;
    cursor: pointer;
}
.todays-journeys .box-shadow-frame{
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
}
.todays-journeys table .add-poi .hidden-btn {
    top: 4px;
    right: 3px;
    border: 1px solid #1a1d1f;
    padding: 4px 9px;
    font-size: 10px;
    color: #fff;
    display: none;
    cursor: pointer;
}
.todays-journeys table .add-poi .hidden-btn .bg {
    top: 0;
    left: 0;
    background: #4a4e53;
    height: 100%;
    width: 100%;
    opacity: 0.8;
}
.todays-journeys table .add-poi .hidden-btn span,
.todays-journeys table .add-poi{
    position: relative;
}
.todays-journeys table .add-poi:hover .hidden-btn {
    display: none;
}
.todays-journeys table .add-poi .hidden-btn,
.todays-journeys table .add-poi .hidden-btn .bg {
    position: absolute;
}
/*today's journeys end*/
/* header panel start*/
.header-panel .btn-holder{
    float: right;
    display: none;
}
.btn-holder{
    overflow: hidden;
}
/*header panel end*/
/*geo zones-panel start*/
.tabset-report-panel {
    font-size: 12px;
    position: absolute;
    top: 0;
    left:0;
    z-index: 1;
    min-width: 360px;
    color: #586974;
    background: #fff;
    display: none;
}
.tabset-report-panel .search.active .dropdown{
    background: #fff;
    z-index: 1;
}
.tabset-report-panel .tabset-report-wrap {
    position: relative;
    z-index: 1;
    -moz-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
}
.tabset-report-panel .tab.active{
    display: block;
}
.tabset-report-panel .tab{
    display: none;
}
.tabset-report-panel .tab.ooi-manager{
    padding: 5px 6px 6px 6px;
}
.tabset-report-panel .tab.ooi-manager .button.delete-polygon{
    margin-right: 54px;
}
.tabset-report-panel .button-wrap{
    overflow: hidden;
    overflow: -moz-hidden-unscrollable;/*firefox fix*/
    height: 24px; /*firefox fix*/
}
.tabset-report-panel .button-wrap .button-holder{
    float: right;
}
.tabset-report-panel .button-wrap .button,
.tabset-report-panel .button-wrap .title{
    float: left;
}
.tabset-report-panel .button-holder .button:last-child{
    margin-left: 7px;
}
.tabset-report-panel .title{
    line-height: 24px;
}
.tabset-report-panel .tab.ooi-manager .search-wrap{
    padding-top: 5px;
}
.tabset-report-panel .ooi-data .input-holder .arrow-holder{
    position: absolute;
    top: -1px;
    right: -1px;
}
.tabset-report-panel .ooi-data .arrow-holder .arrow-up:hover i{
    background-position: -117px -245px;
}
.tabset-report-panel .ooi-data .arrow-holder .arrow-down:hover i{
    background-position: -117px -250px;
}
.tabset-report-panel .ooi-data .arrow-holder .arrow-up i,
.tabset-report-panel .ooi-data .arrow-holder .arrow-down i{
    width: 6px;
    height: 4px;
    display: block;
}
.tabset-report-panel .ooi-data .arrow-holder{
    background: #f4f4f4;
    border: 1px solid #b2b2b2;
}
.tabset-report-panel .ooi-data .arrow-holder .arrow-up i{
    background-position: -111px -245px;
}
.tabset-report-panel .ooi-data .arrow-holder .arrow-down i{
    background-position: -111px -250px;
}
.tabset-report-panel .ooi-data .arrow-holder .arrow-up,
.tabset-report-panel .ooi-data .arrow-holder .arrow-down{
    cursor: pointer;
}
.tabset-report-panel .ooi-data .arrow-holder .arrow-up{
    padding: 4px 4px 3px 4px;
    border-bottom: 1px solid #c6c6c6;
}
.tabset-report-panel .ooi-data .arrow-holder .arrow-down{
    padding: 3px 4px 4px 4px;
}

.input-holder input{
    color: #586974;
    width: 100%;
    padding: 5px 0 4px 0;
    font-size: 12px;
}
.ooi-data .input-holder.counter{
    padding-right: 15px;
}
.ooi-data .row{
    overflow: hidden;
    padding-top: 4px;
}
.ooi-data .row > span,
.alert-tab .input-wrap span{
    line-height: 26px;
    float: left;
}
.input-holder.counter,
.ooi-data .input-holder{
    border: 1px solid #b2b2b2;
    position: relative;
    display: block;
    padding-left: 6px;
    webkit-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
    box-shadow: inset 0px 0px 2px 0px rgba(0,0,0,0.1);
}
.ooi-data .select-holder,
.ooi-data .input-holder{
    margin-left: 126px;
}
.tabset-report-panel .ooi-data .arrow{
    position: absolute;
    top: -9px;
    left: 34px;
    width: 16px;
    height: 9px;
    background-position: -130px -308px;

}
.tabset-report-panel .ooi-data .button.save{
    float: right;
}
.tabset-report-panel .ooi-data .btn-holder{
    padding-top: 10px;
    overflow: hidden;
}
.tabset-report-panel .ooi-data .ui-selectmenu-button{
    padding: 5px 5px 4px 4px;
}
/*geo zones-panel end*/
/* ooi list popup start */
.ooi-list-popup{
    position: absolute;
    top: 65px;
    left: 1px;
    z-index: 2;
    width: 915px;
    background: #fff;
    display: none;
}
.ooi-list-popup .scroll-frame,
.ooi-categories-popup .scroll-frame{
    max-height: 510px;
    overflow: hidden;
    border-bottom: 1px solid #999;
}
.ooi-list-popup .scroll-frame .scrollbar {
    opacity: 0.6;
    right: 0;
    z-index: 100;
}
.ooi-list-popup .info-holder{
    padding: 2px 6px 6px 6px;
}
.ooi-list-popup .info.poi,
.ooi-list-popup .info.aoi {
    border-top: 1px solid #9b9999;
}
.ooi-list-popup table.info.poi th:first-child,
.ooi-list-popup table.info.aoi th:first-child {
    border-left: 1px solid #999;
}
.ooi-list-popup table.info.poi th:first-child,
.ooi-list-popup table.info.poi th:last-child,
.ooi-list-popup table.info.poi td:last-child,
.ooi-list-popup table.info.aoi th:first-child,
.ooi-list-popup table.info.aoi th:last-child,
.ooi-list-popup table.info.aoi td:last-child{
    border-right: 1px solid #999;
}
.ooi-list-popup .info {
    border-bottom: none;
    border-top: none;
}
.ooi-list-popup .info.alerts {
    border-top: 1px solid #9b9999;
}
.ooi-list-popup .info.content{
    border-top: none;
    border-bottom: 1px solid #e7e6e6;
}
.ooi-list-popup .info.poi th:nth-child(2){
    width: 103px;
}
.ooi-list-popup .info.poi th:nth-child(3){
    width: 146px;
}
.ooi-list-popup .info.poi th:nth-child(4){
    width: 76px;
}
.ooi-list-popup .info.poi th:nth-child(5){
    width: 79px;
}
.ooi-list-popup .info.poi th:nth-child(6){
    width: 47px;
}
.ooi-list-popup .info.poi th:nth-child(7){
    width: 84px;
}
.ooi-list-popup .info.poi th:nth-child(8){
    width: 53px;
}
.ooi-list-popup .info.poi th:nth-child(9){
    width: 108px;
}
.ooi-list-popup .info.poi th:nth-child(10){
    width: 29px;
}
.ooi-list-popup .info.content td:first-child{
    border-left: 1px solid #999;
    width: 57px;
}
.ooi-list-popup .info.content.poi td:nth-child(2){
    width: 103px;
}
.ooi-list-popup .info.content.poi td:nth-child(3){
    width: 146px;
}
.ooi-list-popup .info.content.poi td:nth-child(4){
    width: 76px;
}
.ooi-list-popup .info.content.poi td:nth-child(5){
    width: 79px;
}
.ooi-list-popup .info.content.poi td:nth-child(6){
    width: 47px;
}
.ooi-list-popup .info.content.poi td:nth-child(7){
    width: 84px;
}
.ooi-list-popup .info.content.poi td:nth-child(8){
    width: 53px;
}
.ooi-list-popup .info.content.poi td:nth-child(9){
    width: 119px;
}
.ooi-list-popup .info.content.poi td:nth-child(10){
    width: 40px;
}
.ooi-list-popup .info.content tr:hover td.with-button{
    color: #424242;
}
.ooi-list-popup .info.content td:nth-child(9){
    width: 39px;
}

.ooi-list-popup table.info.aoi th:first-child {
    width: 60px;
}
.ooi-list-popup .info.aoi th:nth-child(2){
    width: 288px;
}
.ooi-list-popup .info.aoi th:nth-child(3){
    width: 87px;
}
.ooi-list-popup .info.aoi th:nth-child(4){
    width: 84px;
}
.ooi-list-popup .info.aoi th:nth-child(5){
    width: 53px;
}
.ooi-list-popup .info.aoi th:nth-child(6){
    width: 108px;
}
.ooi-list-popup .info.aoi th:nth-child(7){
    width: 29px;
}

.ooi-list-popup .info.content.aoi td:first-child{
    width: 70px;
}
.ooi-list-popup .info.content.aoi td:nth-child(2){
    width: 329px;
}
.ooi-list-popup .info.content.aoi td:nth-child(3){
    width: 101px;
}
.ooi-list-popup .info.content.aoi td:nth-child(4){
    width: 97px;
}
.ooi-list-popup .info.content.aoi td:nth-child(5){
    width: 62px;
}
.ooi-list-popup .info.content.aoi td:nth-child(6){
    width: 135px;
}


.ooi-list-popup .info.alerts th:first-child{
    width: 48px;
}
.ooi-list-popup .info.alerts th:nth-child(2){
    width: 137px;
}
.ooi-list-popup .info.alerts th:nth-child(3){
    width: 107px;
}
.ooi-list-popup .info.alerts th:nth-child(4){
    width: 125px;
}
.ooi-list-popup .info.alerts th:nth-child(5){
    width: 73px;
}
.ooi-list-popup .info.alerts th:nth-child(6){
    width: 108px;
}
.ooi-list-popup .info.alerts th:nth-child(7){
    width: 57px;
}
.ooi-list-popup .info.alerts th:nth-child(8){
    width: 29px;
}
.ooi-list-popup .info.content.alerts td:first-child{
    width: 58px;
}
.ooi-list-popup .info.content.alerts td:nth-child(2){
    width: 160px;
}
.ooi-list-popup .info.content.alerts td:nth-child(3){
    width: 125px;
}
.ooi-list-popup .info.content.alerts td:nth-child(4){
    width: 147px;
}
.ooi-list-popup .info.content.alerts td:nth-child(5){
    width: 86px;
}
.ooi-list-popup .info.content.alerts td:nth-child(6){
    width: 138px;
}
.ooi-list-popup .info.content.alerts td:nth-child(7){
    width: 79px;
}
/* ooi list popup end */
/* ooi categories popup start */
.ooi-categories-popup{
    position: absolute;
    top: 73px;
    left: 0;
    z-index: 2;
    width: 515px;
    background: #fff;
    display: none;
}
.ooi-categories-popup .header-panel .btn-holder{
    display: block;
}
/*.ooi-categories-popup.tooltip-arrow::after,*/
/*.ooi-categories-popup.tooltip-arrow::before{*/
    /*background: #30527c;*/
/*}*/
.tooltip-arrow::after,
.tooltip-arrow::before{
    content: '';
    position: absolute;
    left: 50%;
    top: -4px;
    margin-left: -3px;
    width: 7px;
    height: 7px;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    z-index: -1;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.ooi-categories-popup .info.content{
    border-top: none;
    border-bottom: none;
}
.ooi-categories-popup .info {
    border-bottom: none;
    border-top: none;
}
.ooi-categories-popup .info.content td:first-child{
    height: 14px;
}
.ooi-categories-popup .info th:nth-child(2){
    width: 158px;
}
.ooi-categories-popup .info th:nth-child(3){
    width: 147px;
}
.ooi-categories-popup .info th:nth-child(4){
    width: 72px;
}
.ooi-categories-popup .info th:nth-child(5){
    width: 29px;
}
.ooi-categories-popup .info.content td:nth-child(2){
    width: 158px;
}
.ooi-categories-popup .info.content td:nth-child(3){
    width: 147px;
}
.ooi-categories-popup .info.content td:nth-child(4){
    width: 83px;
}
.ooi-categories-popup .info.content td:nth-child(5){
    width: 40px;
}
/* ooi categories popup end */
/*ooi category popup start*/
.ooi-category-popup{
    position: absolute;
    top: 20px;
    left: 515px;
    z-index: 2;
    min-width: 330px;
    background: #fff;
    display: none;
}
.ooi-category-popup .ooi-data{
    padding: 2px 8px 8px 8px;
}
/*ooi category popup end*/
/* geo fence alert start*/
.alert-tab .row:first-child{
    padding: 4px;
}
.alert-tab .input-wrap{
    overflow: hidden;
    padding-top: 6px;
}
.alert-tab .tab-control{
    position: relative;
    background: #f4f4f4;
    overflow: hidden;
}
.alert-tab .tab-control span{
    position: relative;
    z-index: 2;
    color:#586974;
}
.alert-tab .tab-control:before {
    content: "";
    position: absolute;
    top: 1px;
    bottom: 1px;
    left: 0;
    right: 0px;
    background: #dfe6eb;
}
.alert-tab .tab-control ul{
    position: relative;
    list-style: none;
    overflow: hidden;
    padding: 1px 0;
}
.alert-tab .tab-control ul:after,
.alert-tab .tab-control ul:before{
    position: absolute;
    left: 0;
    content: "";
    width: 100%;
    /*height: 1px;*/
    background: #dddddd;
}
.alert-tab .tab-control ul:before{
    top: 1px;
}
.alert-tab .tab-control ul:after{
    bottom: 1px;
}
.alert-tab .tab-control li{
    position: relative;
    float: left;
    border-right: 1px solid #b3b9ba;
    padding: 5px 6px 5px 5px;
    background: #dfe6eb;
}
.alert-tab .info-wrap:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 29px;
    content: "";
}
.alert-tab .tab-control li.active{
    background: #dadcdd;
}
.alert-tab .tab-control li.active span {
    color: #586974;
}
.alert-tab .tab-control li.active:after{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    content: "";
    z-index: 1;
}
.alert-tab .ooi-data .input-holder{
    float: left;
    margin-left: 14px;
}
.alert-tab .ooi-data .input-holder input{
    width: 204px;
}
.alert-tab .info-holder,
.button-holder.vertical-button-set{
    float: left;
}
.alert-tab table.info{
    width: 427px;
    border-bottom: none;
}
.alert-tab table.info.content {
    border-right: 1px solid #999;
}
.alert-tab table.info th:last-child {
    border-right: 1px solid #999;
}
.alert-tab .info-holder.right table.info.content {
    border-right: none;
    border-left: 1px solid #999;
}
.alert-tab .info-holder.right table.info th:last-child {
    border-right: none;
}
.alert-tab .info-holder.right table.info th:first-child {
    border-left: 1px solid #999;
}
.alert-tab .button-holder .button:last-child{
    margin-left: 0;
}
.alert-tab .info-holder:first-child th:first-child{
    width: 415px;
}
.alert-tab .info-holder:first-child td:first-child{
    width: 408px;
}
.alert-tab .info-holder.right th:first-child{
    width: 130px;
}
.alert-tab .info-holder.right th:nth-child(2){
    width: 126px;
}
.alert-tab .info-holder.right th:nth-child(3){
    width: 135px;
}
.alert-tab .info-holder.right td:first-child{
    width: 124px;
}
.alert-tab .info-holder.right td:nth-child(2){
    width: 120px;
}
.alert-tab .info-holder.right td:nth-child(3){
    width: 129px;
}
.alert-tab .button-holder.vertical-button-set{
    margin-top: 130px;
}

.alert-tab .scroll-frame{
    border-bottom: 1px solid #9b9999;
}
.alert-tab .info-holder .title{
    padding-left: 6px;
}
.alert-tab .info-wrap{
    overflow: hidden;
    position: relative;
    padding-top: 5px;
}
/* geo fence alert end*/
/* select vehicle start */
.alert-tab .select-vehicle .info-holder.right table.info th:first-child{
    width: 415px;
}
.alert-tab .select-vehicle .info-holder.right table.info td:first-child{
    width: 408px;
}
.alert-tab .button-wrap label{
    float: left;
    padding-top: 5px;
    position: relative;
    z-index: 1;
}
.alert-tab .button-wrap .checkbox{
    float: right;
    margin-left: 6px;
}
.alert-tab .info-wrap .button-wrap .button{
    margin-left: 23px;
}
.alert-tab .info-wrap .button-wrap{
    padding: 4px 6px;
}
/* select vehicle end */
/* select phone start */
.alert-tab .select-phone .info-holder table.info th:first-child{
    width: 48px;
}
.alert-tab .select-phone .info-holder table.info th:nth-child(2){
    width: 57px;
}
.alert-tab .select-phone .info-holder table.info th:nth-child(3){
     width: 67px;
}
.alert-tab .select-phone .info-holder table.info th:nth-child(4){
    width: 106px;
}
.alert-tab .select-phone .info-holder table.info th:nth-child(5){
    width: 85px;
}
.alert-tab .select-phone .info-holder table.info td:first-child{
    width: 43px;
}
.alert-tab .select-phone .info-holder table.info td:nth-child(2){
    width: 53px;
}
.alert-tab .select-phone .info-holder table.info td:nth-child(3){
    width: 63px;
}
.alert-tab .select-phone .info-holder table.info td:nth-child(4){
    width: 102px;
}
/* select phone end */
/* select recipient start */
.alert-tab .select-recipient table.info{
    width: 946px;
}
.alert-tab .select-recipient .info-holder table.info th:first-child{
    width: 188px;
}
.alert-tab .select-recipient .info-holder table.info th:nth-child(2){
    width: 187px;
}
.alert-tab .select-recipient .info-holder table.info th:nth-child(3){
    width: 197px;
}
.alert-tab .select-recipient .info-holder table.info th:nth-child(4){
    width: 188px;
}
.alert-tab .select-recipient .info-holder table.info td:first-child {
   width: 188px;
}
.alert-tab .select-recipient .info-holder table.info td:nth-child(2){
    width: 187px;
}
.alert-tab .select-recipient .info-holder table.info td:nth-child(3){
    width: 197px;
}
.alert-tab .select-recipient .info-holder table.info td:nth-child(4){
    width: 188px;
}
/* select recipient end */
/* geo monitor start */
.geo-monitor table.info{
    width: 1255px;
}
.geo-monitor .info-wrap{
    padding-bottom: 7px;
}
.geo-monitor .header-panel {
    background-color: transparent;
    padding: 4px 6px;
    overflow: visible;
    color: #fff;
}
.tabset-report-panel .geo-monitor .title {
    color: #586974;
}
.geo-monitor .header-panel .button,
.geo-monitor .header-panel .select-group-holder,
.geo-monitor .header-panel .select-date-holder{
    float: left;
}
.geo-monitor .header-panel .select-group-holder{
    position: relative;
    padding-left: 5px;
}
.geo-monitor .header-panel .select-date-holder{
    padding-left: 27px;
}
.geo-monitor .header-panel span.selected-date{
    line-height: 24px;
    padding-right: 8px;
}
.geo-monitor .header-panel .select-holder{
    float: right;
}
.geo-monitor .header-panel .control-holder{
    float: right;
}
.geo-monitor .header-panel .control-holder form li,
.geo-monitor .header-panel .control-holder form li:first-child>div {
    float: left;
    margin-left: 15px;
}
.geo-monitor .header-panel .control-holder form .date .input-holder input {
    height: 8px;
}
.geo-monitor .header-panel .control-holder form li:first-child>div.range span {
    float: left;
    margin-right: 10px;
    line-height: 24px;
    color: #586974;
}
.geo-monitor th:first-child{
    width: 100px;
}
.geo-monitor th:nth-child(2){
    width: 106px;
}
.geo-monitor th:nth-child(3){
    width: 87px;
}
.geo-monitor th:nth-child(4){
    width: 77px;
}
.geo-monitor th:nth-child(5){
    width: 138px;
}
.geo-monitor th:nth-child(6){
    width: 111px;
}
.geo-monitor th:nth-child(7){
    width: 102px;
}
.geo-monitor th:nth-child(8){
    width: 101px;
}
.geo-monitor th:nth-child(9){
    width: 91px;
}
.geo-monitor td:first-child{
    width: 96px;
}
.geo-monitor td:nth-child(2){
    width: 133px;
}
.geo-monitor td:nth-child(3){
    width: 110px;
}
.geo-monitor td:nth-child(4){
    width: 97px;
}
.geo-monitor td:nth-child(5){
    width: 173px;
}
.geo-monitor td:nth-child(6){
    width: 139px;
}
.geo-monitor td:nth-child(7){
    width: 128px;
}
.geo-monitor td:nth-child(8){
    width: 127px;
}
.geo-monitor table.info td:first-child{
    border-left: 1px solid #e7e6e6;
    width: 125px;
}
.geo-monitor .select-group-drop {
    position: absolute;
    top: 0;
    left: 145px;
    z-index: 1;
    width: 338px;
    background: #fff;
}
.geo-monitor .select-group-drop .account-list{
    color: #444;
    padding-bottom: 7px;
}
.geo-monitor .scrollbar {
    opacity: 0.6;
    right: 0;
    z-index: 10;
}
.geo-monitor .date .input-holder input {
    width: auto;
}
/* geo monitor end */

.button-holder.bottom-button-set{
    overflow: hidden;
    padding: 9px;
}
.button-holder.vertical-button-set{
    padding: 0 4px 0 4px;
}
.button-holder.vertical-button-set .button{
    margin-bottom: 4px;
    text-align: center;
}
.shadow{
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
}
.info-holder.no-border  table.info{
    border-top: none;
}
.info-holder.no-border > table.info{
    border-bottom: none;
}
.info-holder.unselectable tr{
    cursor: default;
}
/*colorpicker start*/
.colorpicker ul{
    overflow: hidden;
    padding: 4px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    -webkit-flex-flow: row;
    justify-content: space-between;
}
.colorpicker .ui-selectmenu-text{
    margin-right: 14px;
    display: block;
}
.colorpicker ul li{
    width: 25px;
    height: 25px;
    border: 2px solid #fff;
    border-radius: 2px;
    float: left;
    padding: 0;
}
.colorpicker ul li:last-child{
    margin-right: 0;
}
.colorpicker ul li:hover{
    border-color: #6e6e6e;
}
/*colorpicker end*/
/*ul menu start*/
ul.menu{
    width: 100%;
    height: 34px;
    position: relative;
}
ul.menu li{
    position: relative;
    z-index: 3;
    float: left;
    padding: 9px 8px 9px 8px;
    font-family: Verdana;
    border-right: 1px solid #b3b9ba;
    cursor: pointer;
    /*background: #2c2c2c;*/
    /*background: -moz-linear-gradient(top, #2c2c2c 0%, #000000 100%);*/
    /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2c2c2c), color-stop(100%,#000000));*/
    /*background: -webkit-linear-gradient(top, #2c2c2c 0%,#000000 100%);*/
    /*background: -o-linear-gradient(top, #2c2c2c 0%,#000000 100%);*/
    /*background: -ms-linear-gradient(top, #2c2c2c 0%,#000000 100%);*/
    /*background: linear-gradient(to bottom, #2c2c2c 0%,#000000 100%);*/
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c2c2c', endColorstr='#000000',GradientType=0 );*/
    color: #fff;
}
ul.menu li.active{
    background: #dadcdd;
    color: #586974;
    border-bottom: none;
}
ul.menu li span{
    color: #586974;
    position: relative;
    z-index: 3;
}
ul.menu li:last-child{
    border-right: none;
}
ul.menu:after {
    position: absolute;
    top: 0;
    right: 0;
    left: -1px;
    bottom: 0;
    content: "";
    background: #b3b9ba;
    z-index: 2;
}
ul.menu:before {
    position: absolute;
    top: 0;
    right: 0;
    left: -1px;
    bottom: 1px;
    content: "";
    background: #dfe6eb;
    z-index: 3;
}
ul.menu li.active:after {
    position: absolute;
    top: 0;
    right: -1px;
    left: -1px;
    bottom: -1px;
    content: "";
    background: #fff;
    border-left: 1px solid #aeb0b1;
    border-right: 1px solid #aeb0b1;
    z-index: 2;
}
/*ul menu start*/
/*validation popup start*/
.notification-popup {
    position: absolute;
    top: 0;
    left: 50%;
    width: 470px;
    background-color: #fff;
    margin-left: -235px;
    z-index: 7;
}
.notification-popup .message{
    font-family: Verdana;
    padding: 24px 55px;
    text-align: center;
}
.notification-popup .button-holder{
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    justify-content: space-around;
    padding: 0 104px 26px 104px;
}
.popup-wrap,
.popup-wrap .bg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 6;
}
.popup-wrap{
    display: none;
}
.popup-wrap .bg{
    background: #000;
    opacity: 0.75;
}
/*validation popup end*/
/*groups menu start*/
.groups-menu{
    line-height : 35px;
    max-height: 35px;
    overflow: hidden;
    display: inline-block;
    padding-right: 20px
}

.groups-menu li.active{
    z-index: 2;
    background: #efefef;
}

.groups-menu li.active:before{
    border-color : transparent #efefef transparent transparent;
}


.groups-menu li.active:after{
    border-color : transparent transparent transparent #efefef;
}

.groups-menu li{
    float : right;
    margin : 5px -10px 0;
    border-top-right-radius: 25px 170px;
    border-top-left-radius: 20px 90px;
    padding : 0 30px 0 25px;
    height: 170px;
    background: #ddd;
    position : relative;
    box-shadow: 0 10px 20px rgba(0,0,0,.5);
    max-width : 200px;
}

.groups-menu a{
    display: inline-block;
    max-width:100%;
    overflow: hidden;
    text-overflow: ellipsis;
    text-decoration: none;
    color: #222;
}

.groups-menu li:before,
.groups-menu li:after{
    content : '';
    background : transparent;
    height: 20px;
    width: 20px;
    border-radius: 100%;
    border-width: 10px;
    top: 0px;
    border-style : solid;
    position : absolute;
}

.groups-menu li:before{
    border-color : transparent #ddd transparent transparent;
    -webkit-transform : rotate(48deg);
    left: -23px;
}

.groups-menu li:after{
    border-color : transparent transparent transparent #ddd;
    -webkit-transform : rotate(-48deg);
    right: -17px;
}
/*groups menu end*/
/* lock start */
.lock{
    display: none;
}
.lock.active{
    display: block;
}
.lock,
.lock .bg{
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.lock .bg{
    background: black;
    opacity: 0.5;
}
.lock img{
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -27px 0 0 -27px;
    z-index: 1;
}
/* lock end */

.report-page{
    height: 100%;
}
.report-page .groups-btn{
    text-align: left;
}
.report-page .vehicle-holder .scrollbar{
    opacity: 0.5;
}
/*group tabs*/
.group-tab-container{
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
    max-width: 35px;
    display: none;
}
.group-tab-container .scroll-frame .scrollbar {
    opacity: 0.5;
    left: -4px;
    z-index: 3;
}
.group-tab-container .scroll-frame .handle {
    background-color: #FFF;
    width: 50%;
    float: right;
}
ul.group-tabs{
    margin: 0;
    list-style-type : none;
    line-height : 35px;
    max-width: 35px;
    overflow: hidden;
    display: inline-block;
    padding-top: 20px;
}

ul.group-tabs > li.active{
    z-index: 2;
    background: #efefef;
    margin-left: 10px;
    left: -160px;
}

ul.group-tabs > li.active > a {
    left: -4px;
}

ul.group-tabs > li.active:before{
    border-color : transparent #efefef transparent transparent;
}


ul.group-tabs > li.active:after{
    border-color : transparent transparent transparent #efefef;
}
ul.group-tabs > li{
    margin: -25px -145px 0;
    border-bottom-left-radius: 175px 25px;
    border-top-left-radius: 90px 20px;
    padding: 35px 0 25px 0;
    width: 175px;
    background: #ddd;
    position: relative;
    box-shadow: 0 0 2px rgba(0,0,0,.5);
    min-height: 55px;
    max-height: 55px;
    transform: rotate(-180deg);
}
ul.group-tabs > li > a{
    display: inline-block;
    max-height: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    text-decoration: none;
    color: #fff;
    transform: rotate(-270deg);
    position: absolute;
    transform-origin: 0 100%;
    left: 0;
    bottom: 96px;
    white-space: nowrap;
    min-width: 60px;
    max-width: 70px;
    text-align: center;
    outline: none; /* FF fix */
}
.color-icon {
    display: none;
    position: absolute;
    bottom: 5px;
    left: 6px;
    cursor: pointer;
    z-index: 12;
}
.color-icon.active {
    display: block;
}
/* color picker start*/
.color-picker{
    position: absolute;
    top: 0;
    left: 20px;
    z-index: 1;
    width: 290px;
    background: #fff;
    border: 1px solid #888;
    display: none;
}
.color-picker .header-panel{
    cursor: move;
    padding: 5px 5px 5px 8px;
}
.color-picker form{
    padding: 14px 10px 10px;

}
.color-picker .header-panel .close-btn{
    border: 0;
    background: transparent;
}
.color-picker input[type="color"]{
    width: 123px;
    height: 18px;
    border: 1px solid #b2b2b2;
    border-radius: 5px;
}
.color-picker .button{
    margin-left: 11px;
}
.color-picker input[type="color"],
.color-picker .button{
    display: inline-block;
    vertical-align: middle;
    float: right;
}

.color-picker .button.close-btn {
    float: left;
    margin-left: 0;
    padding: 5px 13px;
    border: 0;
}
/* color picker end*/

.groups-tooltip, .search-tooltip  {
    display: none;
    position: absolute;
    font-size: 12px;
    padding: 6px 9px 7px 9px;
    background: #f2ecc4;
    color: #61540a;
    border: 1px solid #c5cf53;
    border-radius: 2px;
    z-index: 10000;
}
.search-tooltip {
    max-width: 295px;
    text-align: center;
}
.search-tooltip:before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -5px;
    width: 6px;
    height: 6px;
    background-color: #f2ecc4;
    border-right: 1px solid #c5cf53;
    border-bottom: 1px solid #c5cf53;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.left-panel.has-group-tab .search-tooltip, .left-panel.no-group-tab .search-tooltip {
    padding: 3px 8px;
}
.header-panel-undraggable {
    padding: 4px 4px 4px 8px;
    position: relative;
    color: #586974;
    overflow: hidden;
    z-index: 1;
    border-bottom: 1px solid #e8e8e8;
}

.modal-window {
    z-index: 100;
}

.modal-window-inner {
    /* spacing as needed */
    padding: 26px 10px 10px;
    display: table;
}

.modal-window-overlay {
    z-index: 50;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.32);
}

.content-wrap {
    height: 66%;
}

.report-popup.driving-time {
    width: 718px;
    z-index: 2;
}

.driving-time .scroll-frame {
    overflow: hidden;
}

.driving-time .scroll-content {
    max-height: 400px;
}

.driving-time .control-panel {
    height: 0;
}

.driving-time .modal-window {
    min-width: 320px;
    max-width: 100%;
    height: 169px;
    position: absolute;
    top: 36px;
    left: 600px;
    background: #fff;
}

.modal .header-panel-undraggable .title {
    font-size: 12px;
    line-height: 25px;
}

.driving-time .modal .content-wrap .inner-block {
    height: 100%;
    padding-left: 10px;
    padding-right: 10px
}

.driving-time .modal .content-wrap .input-holder.counter {
    max-width: 66px;
    margin-left: 5px;
    margin-right: 6px;
    bottom: 5px;
}

.driving-time .content-wrap .arrow-holder{
    position: absolute;
    top: -1px;
    right: -1px;
}

.driving-time .content-wrap .arrow-holder .arrow-up:hover i{
    background-position: -117px -245px;
}

.driving-time .content-wrap .arrow-holder .arrow-down:hover i{
    background-position: -117px -250px;
}

.driving-time .content-wrap .arrow-holder .arrow-up i,
.driving-time .content-wrap .arrow-holder .arrow-down i{
    width: 6px;
    height: 4px;
    display: block;
}

.driving-time .content-wrap .arrow-holder{
    background: #f4f4f4;
    border: 1px solid #b2b2b2;
}

.driving-time .content-wrap .arrow-holder .arrow-up i{
    background-position: -111px -245px;
}

.driving-time .content-wrap .arrow-holder .arrow-down i{
    background-position: -111px -250px;
}

.driving-time .content-wrap .arrow-holder .arrow-up,
.driving-time .content-wrap .arrow-holder .arrow-down{
    cursor: pointer;
}

.driving-time .content-wrap .arrow-holder .arrow-up{
    padding: 4px 4px 3px 4px;
    border-bottom: 1px solid #c6c6c6;
}

.driving-time .content-wrap .arrow-holder .arrow-down{
    padding: 3px 4px 4px 4px;
}

.driving-time .modal .content-wrap .first-row {
    margin-top: 25px;
}

.driving-time .modal .content-wrap .mixed-row {
    display: inline-flex;
    margin-top: 20px;
}

.driving-time .modal .content-wrap .buttons-footer {
    margin-top: 23px;
}

.driving-time .modal .content-wrap .buttons-footer .button {
    margin-right: 10px;
}

.driving-time .modal .content-wrap .buttons-footer .button.first {
    margin-right: 99px;
}

/* Driving Time table headers*/
.report-popup.driving-time table.info th:first-child {
    width: 90px;
}

.report-popup.driving-time table.info th:nth-child(2) {
    width: 130px;
}

.report-popup.driving-time table.info th:nth-child(3) {
    width: 110px;
}

.report-popup.driving-time table.info th:nth-child(4) {
    width: 110px;
}

.report-popup.driving-time table.info th:nth-child(5) {
    width: 104px;
}

.report-popup.driving-time table.info th:nth-child(6) {
    width: 96px;
}
/* Driving Time table rows*/
.report-popup.driving-time table.info td:first-child {
    width: 84px;
}

.report-popup.driving-time table.info td:nth-child(2) {
    width: 125px;
}

.report-popup.driving-time table.info td:nth-child(3) {
    width: 106px;
}

.report-popup.driving-time table.info td:nth-child(4) {
    width: 105px;
}

.report-popup.driving-time table.info td:nth-child(5) {
    width: 98px;
}

.report-popup.driving-time table.info td:nth-child(6) {
    width: 89px;
}

/* new activity-log start */
.advanced-activity-log .control-panel {
    background: #fff;
    padding: 3px 0 3px 10px;
    overflow: hidden;
}

.advanced-activity-log .control-panel form {
    float: left;
}

.advanced-activity-log .control-panel ul > li {
    float: left;
    padding-right: 15px;
}

.advanced-activity-log .control-panel .button {
    padding: 4px 13px;
}

.advanced-activity-log .control-panel .button.click-report {
    float: left;
    margin-right: 15px;
}

.advanced-activity-log .range,
.advanced-activity-log .range span {
    float: left;
    overflow: hidden;
}

.advanced-activity-log .date {
    padding-left: 10px;
}

.advanced-activity-log .time-range span,
.advanced-activity-log .range span {
    line-height: 24px;
    color: #586974;
    float: left;
}

.advanced-activity-log .range input {
    width: 100px;
    font-size: 12px;
}

.advanced-activity-log .button.submit {
    float: right;
}

.advanced-activity-log.simple-popup {
    min-width: 816px;
    max-width: 1024px;
    top: 46px;
    left: 411px;
}

.advanced-activity-log.simple-popup .header-panel {
    cursor: move;
}

.advanced-activity-log .range:first-child {
    padding-right: 16px;
}

.advanced-activity-log .scroll-frame {
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 0;
}

.advanced-activity-log .scrollbar {
    right: 1px;
    opacity: 0.5;
    z-index: 1;
}

.advanced-activity-log li.plot-all {
    padding-top: 5px;
    color: #586974;
}

li.plot.plot-all.disabled {
    pointer-events: none;
}

.advanced-activity-log span.checkbox {
    margin-right: 5px;
}

.advanced-activity-log table.info th:first-child,
.advanced-activity-log table.info td:first-child{
    width: 49px;
}

.advanced-activity-log table.info th:nth-child(2),
.advanced-activity-log table.info td:nth-child(2) {
    width: 49px;
}

.advanced-activity-log table.info th:nth-child(3),
.advanced-activity-log table.info td:nth-child(3) {
    width: 178px;
}

.advanced-activity-log table.info th:nth-child(4),
.advanced-activity-log table.info td:nth-child(4) {
    width: 58px;
}

.advanced-activity-log table.info th:nth-child(5),
.advanced-activity-log table.info td:nth-child(5) {
    width: 203px;
}

.advanced-activity-log table.info th:nth-child(6),
.advanced-activity-log table.info td:nth-child(6) {
    width: 80px;
}
.advanced-activity-log table.info th:nth-child(8),
.advanced-activity-log table.info td:nth-child(8) {
    width: 100px;
}
.advanced-activity-log table.info th {
    padding-right: 5px;
}

.advanced-activity-log table.info td:last-child {
    border: none;
}

.advanced-activity-log .select-holder {
    overflow: hidden;
}

.advanced-activity-log .time-range {
    float: left;
    padding-right: 15px;
}

.advanced-activity-log .time-range input {
    padding-left: 9px;
    padding-top: 4px;
    padding-bottom: 4px;
    width: 38px;
    font-size: 12px;
    border: 1px solid #999;
    line-height: 14px;
}

.advanced-activity-log .time-range input::-webkit-calendar-picker-indicator {
    display: none;
}

.advanced-activity-log .time-range .time {
    overflow: hidden;
    float: left;
    padding-left: 10px;
    /*padding-top: 1px;*/
}
.time-range .time input {
    color: #586974;
}

.advanced-activity-log .date .input-holder input {
    padding: 6px 0 6px 9px;
}

.advanced-activity-log .date .calendar-btn {
    padding-top: 5px;
    padding-bottom: 5px;
}

.advanced-activity-log .ui-widget {
    overflow: hidden;
}

.custom-combobox {
    position: relative;
    display: inline-block;
}

.custom-combobox-input {
    margin: 0;
}

.date {
    position: relative;
}

.date .calendar-btn {
    position: absolute;
    top: 0;
    right: 0;
    padding: 5px 4px 7px 5px;
    /*border: 1px solid #999;*/
}

/*.date .calendar-btn.active {*/
    /*background: #ea9e0b;*/
    /*border-color: #ea9e0b;*/
/*}*/

.date .input-holder input {
    padding: 7px 33px 7px 9px;
    height: 10px;
}

.range,
.range span,
.date,
.report-popup .date-range .time {
    float: left;
    overflow: hidden;
}

/* css for datetimepicker */
.ui-timepicker-div {
    border-top: 1px solid #d9d9d9;
    padding: 0 13px 0 3px;
    color: #424242;
    background: #fff;
}

.ui-slider-handle {
    position: absolute;
    top: -5px;
    left: 0;
    width: 14px;
    height: 14px;
    background: #8f8f8f;
    outline: none;
    border-radius: 7px;
}

.ui-slider-handle:hover,
.ui-slider-handle:active {
    background: #ea9e0b;
}

.ui-datepicker-buttonpane {
    padding: 14px 9px 8px 8px;
    overflow: hidden;
    background: #fff;
}

.ui-datepicker-buttonpane button {
    height: 26px;
    border: #609cc3 solid 1px;
    margin: 0;
    padding: 0 13px;
    outline: none;
    color: #fff;
    font-size: 12px;
    background: #6ab0de;
}

.ui-datepicker-buttonpane button:hover {
    background: #046b97;
}

.ui-datepicker-buttonpane button:active {
    color: #012a3b;
    border: #609cc3 solid 1px;
    cursor: default;
    background: #046b97;
}

.ui-datepicker-buttonpane button:last-child {
    float: right;
}

.ui-timepicker-div .ui-widget-header {
    margin-bottom: 8px;
}

.ui-timepicker-div dl {
    text-align: left;
}

.ui-timepicker-div dl dd {
    margin: 9px 0 0 82px;
    overflow: hidden;
}

.ui-timepicker-div dl dt {
    float: left;
    clear: left;
    padding: 9px 0 0 5px;
}

.ui-timepicker-div dl {
    margin: 0;
}

.ui-timepicker-div,
.ui-timepicker-div dl {
    overflow: hidden;
}

.ui-tpicker-grid-label {
    background: none;
    border: none;
    margin: 0;
    padding: 0;
}

.ui_tpicker_hour,
.ui_tpicker_minute {
    height: 15px;
}

.ui_tpicker_hour_slider,
.ui_tpicker_minute_slider {
    position: relative;
    width: 104px;
    height: 4px;
    margin-top: 5px;
    margin-right: 14px;
}

.slider-wrap {
    background: #dddddd;
}

.ui_tpicker_second,
.ui_tpicker_millisec,
.ui_tpicker_microsec,
.ui_tpicker_timezone {
    display: none;
}

/*datetimepicker end*/

.customPushpin div {
    color: #000 !important;
}

.table-spinner {
    display: none;
}

.table-spinner.active {
    display: block;
    position: fixed;
    height: 30%;
    width: 720px;
    opacity: 0.6;
    z-index: 1;
    background: white;
}
.customPushpin div {
    color: #000 !important;
}

::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background-color: #fff;
}

::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}

::-webkit-scrollbar-button {
    background-color: #fff;
    height: 0;
}

::-webkit-scrollbar-corner {
    background-color: #000;
}
/* new activity-log end */
/* STPDF start*/
.journey-details-popup .button.click-report {
    float: right;
    margin-right: 6px;
}


/* STPDF end*/

/* preferences styles */


.car_big {
    width: 60px;
    height: 18px;
    /*float: left;*/
    background-position: -210px -400px;
}

.car_middle {
    width: 30px;
    height: 9px;
    /*float: left;*/
    background-position: -210px -388px;
}

.car_small {
    width: 23px;
    height: 7px;
    /*float: left;*/
    background-position: -210px -378px;
}

.simple-popup.preferences {
    width: 355px;
    min-height: 100px;
    align: center;
}

.simple-popup.preferences.tooltip-arrow::after,
.simple-popup.preferences.tooltip-arrow::before{
    left: 36px;
}

.preferences .input-holder.counter {
    width: 37px;
    display: inline-block;
}


.preferences .btn-holder {
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 40px;
    margin-bottom: 10px;
}

.preferences-main .row {
    overflow: hidden;
}

.preferences-main .checkbox {
    margin-right: 9px;
}

.preferences .radio{
    margin: auto 11px auto 0;
}

.preferences input[type="radio"]{
    display: none;
}

.preferences .preferences-wrap label{
    display: inline-flex;
    margin-right: 10px;
}

.preferences .preferences-wrap .row label,
.preferences .preferences-wrap .row label img
{
    float:left;
}

.preferences-wrap {
    padding: 15px 0 8px 0;
}

.preferences-wrap .car {
    margin: auto 10px auto 0;
    /*display: flex;*/
}
/* preferences styles end */

/** HTMLTOS-1 Time On Site Report **/
.report.time-on-site {
    width: 90%;
}
.report-popup .time-on-site {

}
.report-popup .select-holder {
    padding: 5px 5px 10px 25px;
}
.report-popup .select-holder .row {
    border: none;
    padding: 5px 0 0 0;
    overflow: visible;
}
.report-popup .select-holder .row .select {
    position: relative;
    background: #f3f3f3;
}
.proximity .title-holder,
.report-popup .title-holder {
    padding: 4px 5px 4px 6px;
    border: 1px solid #b2b2b2;
    cursor: pointer;
}
.proximity .select .title-holder span,
.report-popup .select .title-holder span {
    max-width: none;
    white-space: nowrap;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}
.proximity .select .title-holder i,
.report-popup .select .title-holder i{
    background-position: -302px -174px;
    float: right;
    width: 9px;
    height: 6px;
    margin-top: 5px;
}
.proximity .select.active .title-holder i,
.report-popup .select.active .title-holder i {
    background-position: -302px -182px;
}
.report-popup .report-wrap .row {
    border: none;
    padding: 10px 0 0 0;
}
.proximity .select .dropdown,
.proximity .search .dropdown,
.report-popup .select .dropdown,
.report-popup .search .dropdown{
    position: absolute;
    top: 25px;
    left: 0;
    background: #fff;
    width: 100%;
    z-index: 1;
    padding-bottom: 3px;
    -webkit-box-shadow: 0px 5px 5px 1px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 5px 5px 1px rgba(0,0,0,0.3);
    box-shadow: 0px 5px 5px 1px rgba(0,0,0,0.3);
    display: none;
}
.proximity .select .scroll-content,
.proximity .search .scroll-content,
.report-popup .select .scroll-content,
.report-popup .search .scroll-content{
    max-height: 177px;
}
.proximity .select .scrollbar,
.proximity .search .scrollbar,
.report-popup .select .scrollbar,
.report-popup .search .scrollbar {
    width: 10px;
    opacity: 0.5;
    right:1px;
    top:1px;
    z-index: 1;
    display: none;
}
.report-popup.time-on-site  .select .scrollbar.vertical,
.report-popup.journey .select-holder .scrollbar.vertical{
    position: absolute;
    top: 0;
    right: 1px;
    width: 10px;
    height: 100%;
    opacity: 0.5;
    z-index: 1;
    display: none;
}
.report-popup .select.active .dropdown,
.report-popup .search.active .dropdown {
    display: block;
}
.report-popup .select .dropdown li,
.report-popup .search .dropdown li{
    padding: 3px 0 4px 8px;
    font-size: 11px;
}
.report-popup .select .dropdown li:hover,
.report-popup .search .dropdown li:hover{
    background: #dadcdd;
}

.report-popup.time-on-site .input-holder.counter {
    margin-left: 6px;
    margin-right: 6px;
}

.time-on-site-details-popup {
    display: none;
    width: 306px;
    position: absolute;
    top: 25%;
    left: 25%;
    z-index: 1233;
    -webkit-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
}

.time-on-site-details-popup .header-panel {
    border-bottom: none;
    border-left: 1px solid #999999;
    border-top: 1px solid #999999;
    border-right: 1px solid #999999;
}

.time-on-site-details-popup .info-holder {
    border-bottom: 1px solid #999999;
    border-left: 1px solid #999999;
}

.time-on-site-details-popup .info-holder td {
    border-bottom: 1px solid #999999;
}

.time-on-site-details-popup .info-holder td.header {
    background-color: #e8e7e7;
    width: 105px;
    border-bottom: 1px solid #999999;
}

.time-on-site-details-popup .info-holder tr:last-child td {
    border-bottom: none;
}

.time-on-site .search{
    position: relative;
}
/** HTMLTOS-1 Time On Site Report **/
/* counter start*/
.input-holder.counter{
    padding-right: 15px;
}
.input-holder.counter .arrow-holder{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}
.input-holder.counter .arrow-holder .arrow-up:hover i{
    background-position: -117px -245px;
}
.input-holder.counter .arrow-holder .arrow-down:hover i{
    background-position: -117px -250px;
}
.input-holder.counter .arrow-holder .arrow-up i,
.input-holder.counter .arrow-holder .arrow-down i{
    width: 6px;
    height: 4px;
    display: block;
}
.input-holder.counter .arrow-holder{
    background: #f4f4f4;
    border-left: 1px solid #b2b2b2;
}
.input-holder.counter .arrow-holder .arrow-up i{
    background-position: -111px -245px;
}
.input-holder.counter .arrow-holder .arrow-down i{
    background-position: -111px -250px;
}
.input-holder.counter .arrow-holder .arrow-up,
.input-holder.counter .arrow-holder .arrow-down{
    cursor: pointer;
}
.input-holder.counter .arrow-holder .arrow-up{
    padding: 4px 4px 3px 4px;
    border-bottom: 1px solid #f2f2f2;
}
.input-holder.counter .arrow-holder .arrow-down{
    padding: 3px 4px 4px 4px;
}
.input-holder.counter,
.ooi-data .input-holder{
    position: relative;
    display: block;
    padding-left: 6px;
}
.input-holder.counter .arrow-holder .arrow-up:hover i{
    background-position: -117px -245px;
}
.input-holder.counter .arrow-holder .arrow-down:hover i{
    background-position: -117px -250px;
}
.input-holder input{
    width: 100%;
    padding: 5px 0 4px 0;
    font-size: 12px;
}
/* counter end*/
/* HTMLLOC-1 */
.proximity-view.location-report-view .search.location-search {
    padding-top: 5px;
}
.proximity-view.location-report-view .select-holder {
    padding: 0 5px;
}
.proximity .title,
.location-report-view .title {
    padding-left: 9px;
}
.proximity .btn-holder .report-frame {
    padding-top: 10px;
}
.left-panel .right-col .control-holder .proximity-view .row {
    background-color: transparent;
}
.tab.proximity .button-wrap .title {
    padding: 0 0 0 9px;
    color:#444;
}
.tabset-report-panel .proximity .button-wrap {
    padding: 0;
    background: #fff;
    height: auto;
}
.tabset-report-panel.proximity .proximity-view {
    display: block;
    background: #fff;
}
.tabset-report-panel.proximity {
    min-width: 324px;
    width: 324px;
}
.tabset-report-panel.proximity .left-panel {
    top: 156px;
    position: static;
}
.tabset-report-panel.proximity .left-panel .right-col {
    width: 324px;
}

.user-menu .categories .proximity .tooltip{
    padding: 8px 12px 0 8px;
    color: #586974;
}

.user-menu .categories .bi .tooltip{
    padding: 8px 12px 0 8px;
    color: #586974;
}

.user-menu .categories .proximity i {
    height: 21px;
    width: 21px;
    background-position: -280px -399px;
}
.user-menu .categories .proximity.active i {
    background-position: -280px -421px;
}
.user-menu .categories .proximity:active i {
    background-position: -280px -377px;
}
.user-menu .categories .proximity:hover i {
    background-position: -280px -399px;
}
.location-report-view {
    padding: 0 0 10px 0;
}
.location-report-view .row {
    padding-top: 4px;
}
.location-report-view .row > span {
    line-height: 24px;
    float: left;
    padding-top: 1px;
}
.location-report-view .input-holder {
    position: relative;
    display: block;
    padding-left: 6px;
    margin-left: 100px;
}
.location-report-view .range:first-child {
    padding-right: 14px;
}
.location-report-view .range {
    float: left;
    overflow: hidden;
}
.location-report-view .section {
    display: flex;
    vertical-align: top;
}
.location-report-view .section span {
    padding-left: 10px;
    margin-top: 5px;
}
.location-report-view .report-wrap {
    padding-left: 26px;
    padding-bottom: 10px;
}
.location-report-view .report-frame {
    padding: 3px 10px 0 0;
}
.tab.proximity .select-holder,
.proximity-view.location-report-view .select-holder {
    padding-right: 0;
}
.location-report-view .select-holder.aoi-poi {
    padding-left: 0;
    margin-left: 100px;
}
.location-report-view .search .input-holder {
    margin-left: 0;
    margin-right: 6px;
}
.tab.active .search-wrap {
    position: relative;
    margin-top: 10px;
}
.tabset-report-panel .tab.proximity {
    padding: 3px 10px 0 0;
    background: #fff;
}

.left-panel.proximity .control-header {
    box-shadow: inset 0 2px 5px 0 rgba(0,0,0,0.4);
}
.left-panel.proximity .scrollbar {
    opacity: 0.6;
}

.left-panel.proximity .scroll-content {
    max-height: 721px;
}

.proximity .tabset-report-wrap .row,
.proximity .report-wrap .row {
    border: none;
    padding-top: 5px;
}

.proximity .search .input-holder .button {
    padding-top: 4px;
    padding-bottom: 5px;
}

.tab.proximity .row .select-holder .select,
.location-report-view .row .select-holder .select {
    position: relative;
    background: #fff;
}

.tab.proximity .row .select-holder .select.active,
.location-report-view .row .select-holder .select.active {
    background: #fff;
}

/*.left-panel.proximity .right-col {*/
/*box-shadow: 0 -1px 3px 1px rgba(0,0,0,0.4);*/
/*}*/

.left-panel.proximity .right-col .row {
    padding: 0;
}

.proximity-wrap {
    padding-left: 25px;
    padding-bottom: 10px;
}

.proximity-wrap .row > span {
    line-height: 24px;
    float: left;
}
.proximity-wrap .row .select-holder {
    margin-left: 100px;
}

.location .report-frame {
    border-top: none;
}

.proximity .advanced-activity-log.simple-popup {
    visibility: hidden;
    min-width: 1115px;
    max-width: 1115px;
}

.tab.proximity .select.active .dropdown {
    display: block;
}

.proximity .advanced-activity-log table.info th:first-child,
.proximity .advanced-activity-log table.info td:first-child{
    width: 68px;
}

.proximity .advanced-activity-log table.info th:nth-child(2),
.proximity .advanced-activity-log table.info td:nth-child(2) {
    width: 110px;
}

.proximity  .advanced-activity-log table.info th:nth-child(3),
.proximity  .advanced-activity-log table.info td:nth-child(3) {
    width: 110px;
}

.proximity .advanced-activity-log table.info th:nth-child(4),
.proximity .advanced-activity-log table.info td:nth-child(4) {
    width: 228px;
}

.proximity .advanced-activity-log table.info th:nth-child(5),
.proximity .advanced-activity-log table.info td:nth-child(5) {
    width: 118px;
}

.proximity .advanced-activity-log table.info th:nth-child(6),
.proximity  .advanced-activity-log table.info td:nth-child(6) {
    width: 175px;
    border-right: 1px solid #999;
}

.proximity .advanced-activity-log table.info th:nth-child(7),
.proximity  .advanced-activity-log table.info td:nth-child(7) {
    width: 70px;
}

.proximity .advanced-activity-log table.info th:nth-child(8),
.proximity  .advanced-activity-log table.info td:nth-child(8) {
    width: 90px;
    border-right: none;
}
/* HTMLLOC-1 */
.tab.active .search-wrap {
    position: relative;
    margin-top: 10px;
}

/*spinner start*/
.table-spinner {
    display: none;
}

.table-spinner.active {
    display: block;
    position: fixed;
    height: 30%;
    width: 720px;
    opacity: 0.6;
    z-index: 1;
    background: white;
}

.location-table-spinner {
    display: none;
}
.location-table-spinner.active {
    display: block;
    position: fixed;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;
    /*height: 100%;*/
    /*width: 100%;*/
    opacity: 0.6;
    z-index: 100000;
    background: white;
}
/*spinner end*/

/* Add POI/AOI in table */
.poi-address {
    position: relative;
}

#addPoiMenu {
    position: absolute;
    z-index: 10;
}

.drop-poi-btn {
    padding: 4px 10px;
    background-color: rgba(10, 10, 10, 0.6);
    -moz-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    color: #ccc;
    cursor: pointer;
}

.report.journey .drop-poi-btn {
    padding: 4px 10px;
}

.drop-poi-btn:hover {
    background-color: rgba(8, 130, 183, 0.6);
    -moz-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    -webkit-box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    box-shadow: 0 1px 3px 1px rgba(0,0,0,0.4);
    color: #fff;
}
/* end Add POI/AOI in table */

/*react styles start*/
/*time sheet report start*/
#time_sheet {
    position: absolute;
    top: 0;
    left: 0;
    background: #fff;
    z-index: 1;
    bottom: 0;
}
.time-sheet-report {
    width: 960px;
    font-size: 12px;
    min-height: 320px;
    box-shadow: 0 1px 3px 1px rgba(0,0,0,.4);
    z-index: 1
}
.report-header {
    padding: 10px 9px;
    color: #586974;
    box-shadow: 0 0 2px 0 rgba(0,0,0,.5)
}
.time-sheet-report .time-sheet-table table th {
    position: relative;
    color: #000;
    border-right: 1px solid #939393;
    padding: 8px 0 8px 11px;
    text-align: left;
    font-weight: 400;
    font-size: 12px;
    background: -moz-linear-gradient(top, #f5f6f7 0%, #dadcdd 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f6f7), color-stop(100%,#dadcdd));
    background: -webkit-linear-gradient(top, #f5f6f7 0%,#dadcdd 100%);
    background: -o-linear-gradient(top, #f5f6f7 0%,#dadcdd 100%);
    background: -ms-linear-gradient(top, #f5f6f7 0%,#dadcdd 100%);
    background: linear-gradient(to bottom, #f5f6f7 0%,#dadcdd 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f7', endColorstr='#dadcdd',GradientType=0 )
}
.time-sheet-report .time-sheet-table table {
    width: 100%;
    border-top: 1px solid #939393;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}
.time-sheet-report .time-sheet-table table th:hover {
    background: #999;
}
.time-sheet-report .time-sheet-table table tbody tr:hover {
    background: #bfc2c4;
}
.time-sheet-report .time-sheet-table table td {
    padding: 7px 5px 8px 11px;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-right: 1px solid #939393;
    color: #000;
    font-size: 12px;
}
.time-sheet-report .time-sheet-table .d-flex:nth-child(3) table tr:last-child td {
    border-bottom: 1px solid #939393;
}
.time-sheet-report .form-actions .dd-wrapper {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 10px;
}
.time-sheet-report .form-actions .dd-wrapper {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-left: 10px;
    background: -moz-linear-gradient(top, #f5f6f7 0%, #dadcdd 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f6f7), color-stop(100%,#dadcdd));
    background: -webkit-linear-gradient(top, #f5f6f7 0%,#dadcdd 100%);
    background: -o-linear-gradient(top, #f5f6f7 0%,#dadcdd 100%);
    background: -ms-linear-gradient(top, #f5f6f7 0%,#dadcdd 100%);
    background: linear-gradient(to bottom, #f5f6f7 0%,#dadcdd 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f7', endColorstr='#dadcdd',GradientType=0 );
}
.time-sheet-report .time-sheet-table {
    background-color: #fff;
}
.time-sheet-report .time-sheet-table__content {
    padding: 15px 0 5px 8px;
}
/*time sheet report end*/
.report-header__form {
    padding: 3px 9px;
    color: #586974;
    background-color: #dadcdd;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .4);
}
.report-header__form .additional-info {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin: auto;
}
/*dd start*/
.dd-wrapper {
    width: 140px;
    position: relative;
    background: #fff;
    padding: 5px 5px 3px 4px;
    border: 1px solid #ccc;
    outline: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.dd-wrapper i {
    position: absolute;
    right: 7px;
    top: 4px;
    width: 9px;
    height: 6px;
    background-position: -302px -174px;
    margin-top: 5px;
}
.dd-wrapper .ico-select-closed {
    background-position: -302px -174px;
}
.dd-wrapper .ico-select-open {
    background-position: -302px -182px;
}
.dd-wrapper .dd-header .dd-header-title{
    color:#586974;
}
.dd-wrapper .dd-list .dd-list-item {
    padding: 2px 3px;
    width: calc(100% - 6px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    color: #586974;
}
.dd-wrapper .dd-list .dd-list-item:hover {
    background-color: #dadcdd;
}
/*dd end*/
/*rcs start*/
.rcs-custom-scroll {
    height: 100%;
    min-height: 0;
    min-width: 0;
}
.rcs-custom-scroll .rcs-inner-container {
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    height: 100%;
}
.rcs-custom-scroll .rcs-outer-container .rcs-positioning {
    position: relative;
}
.rcs-custom-scroll .rcs-outer-container {
    overflow: hidden;
    height: 100%;
}
.rcs-custom-scroll .rcs-custom-scrollbar {
    position: absolute;
    height: 100%;
    width: 6px;
    right: 3px;
    opacity: 0;
    z-index: 1;
    transition: opacity .4s ease-out;
    padding: 6px 0;
    box-sizing: border-box;
    will-change: opacity;
    pointer-events: none;
}
.rcs-custom-scroll .rcs-outer-container:hover .rcs-custom-scrollbar {
    opacity: 1;
    transition-duration: .2s;
}
/*rcs end*/
/*scheduled reports start*/
.scheduled-reports {
    width: 900px;
    height: auto;
    left: 0;
    font-size: 12px;
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, .4);
    z-index: 1;
}
.tabs, .tabs > li {
    position: relative;
}
.tabs {
    list-style: none;
    overflow: hidden;
    color: #fff;
}
.tabs:before {
    bottom: 0;
    background: #dfe6eb;
}
.tabs:before, .tabs > li.active:after {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    content: "";
}
.tabs > li.active {
    color: #586974;
}
.tabs > li {
    float: left;
    border-right: 1px solid #b3b9ba;
    padding: 10px 6px 10px 5px;
    /*background: #2e70aa;*/
    cursor: pointer;
}
.tabs > li.active:after {
    bottom: -2px;
    background: #fff;
    z-index: 1;
}
.tabs > li span {
    position: relative;
    z-index: 2;
}
.scrollbar--view {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: scroll;
    margin-right: -17px !important;
    margin-bottom: -17px !important;
}
.popup-header {
    color: #fff;
    background: #dfe6eb;
    padding: 4px 5px 4px 8px;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.scheduled-reports .scheduled-content .weekdays-btn i {
    width: 9px;
    height: 10px;
    display: block;
    background-position: -135px -372px;
}
.scheduled-reports .scheduled-content .weekdays-btn.disabled i {
    background-position: -148px -372px;
    cursor: not-allowed;
}
.scheduled-reports .scheduled-content .ico-holder .arrow-ico {
    display: inline-block;
    margin: 0 4px 2px 0;
    width: 7px;
    height: 8px;
    background-position: -140px -173px;
}
.scheduled-reports .scheduled-content .is-o > label .ico-holder .arrow-ico {
    margin: 0 4px 0 0;
    background-position: -147px -174px;
}
.scheduled-reports .scheduled-content .weekdays-btn.active i {
    background-position: -135px -372px;
}
.scheduled-reports .sr-weekly {
    position: absolute;
    top: 100px;
    left: 735px;
    width: 135px;
    padding: 8px 0 6px;
    background: #fff;
    box-shadow: 0 1px 5px 0 rgba(0, 0, 0, .5);
}
.box__row span {
    margin: auto 0;
}
.scheduled-reports .scheduled-content .w-radio label {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: 20px;
    cursor: pointer;
}
.scheduled-reports .sr-weekly label .checkbox {
    margin-right: 6px;
}
.popup-header .close-btn {
    cursor: pointer;
    background: transparent;
    padding: 5px;
    float: right;
    margin-left: 7px;
}
.scheduled-report-list table th {
    position: relative;
    color: #586974;
    background: #ced9dc;
    border-right: 1px solid #999;
    padding: 8px 0 8px 11px;
    text-align: left;
    font-weight: 400;
    font-size: 12px;
}
.scheduled-report-list table th:hover {
    color: #6ab0de;
}
.scheduled-report-list table td {
    padding: 7px 5px 8px 11px;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-right: 1px solid #999;
    color: #586974;
    font-size: 12px;
}
.scheduled-report-list table tbody tr.active,
.scheduled-report-list table tbody tr:hover {
    background: #d0e4ee;
}
.scheduled-report-list table {
    border-top: 1px solid #999;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}
.scheduled-report-list table {
    border-top: 1px solid #999;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}
.scheduled-report-list .table {
    width: 1300px;
}
.dx-g-bs4-table-container {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}
.scheduled-report-list {
    position: absolute;
    top: 35px;
    min-width: 320px;
    z-index: 10;
    background: #fff;
    box-shadow: 0 0 3px 1px rgba(0, 0, 0, .4);
}
.scheduled-report-list table tr:nth-child(odd) {
    background: #f6f7f7;
}
.manage-recipients table th {
    position: relative;
    color: #586974;
    border-right: 1px solid #999;
    padding: 8px 0 8px 11px;
    text-align: left;
    font-weight: 400;
    font-size: 12px;
    border-bottom: 1px solid rgba(0, 0, 0, .7);
    background: #ced9dc;
}
.manage-recipients table th:hover {
    color: #398fbc;
}
.manage-recipients table tbody tr:nth-child(odd) {
    background: #f6f7f7;
}
.manage-recipients table tbody tr:hover {
    background: #bfc2c4;
}
.manage-recipients table td {
    padding: 7px 5px 8px 11px;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-right: 1px solid #999;
    color: #586974;
    font-size: 12px;
}
.manage-recipients .table {
    width: 550px;
}
.manage-recipients table {
    border-top: 1px solid #999;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}
.manage-recipients table td .delete {
    background-position: -172px -321px;
}
.manage-recipients table td .delete:hover {
    background-position: -172px -339px;
}
.scheduled-content .input-row .input-holder.counter .arrow-holder .arrow-down,
.scheduled-content .input-row .input-holder.counter .arrow-holder .arrow-up {
    padding: 3px 4px 0px;
    cursor: pointer;
}
.scheduled-content .input-row .input-holder.counter .arrow-holder .arrow-up {
    border-bottom: 1px solid #b2b2b2;
}
.scheduled-content .input-row .input-holder.counter .arrow-holder {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    background: #f4f4f4;
    border-left: 1px solid #b2b2b2;
}
/*scheduled reports end*/

/*notification start*/
.alert--popup__header .close-btn i {
    display: block;
    width: 8px;
    height: 8px;
    background-position: -292px -335px;
}

.alert--popup__header .close-btn:hover {
    background-color: transparent
}

.alert--popup__header .close-btn:hover i {
    background-position: -282px -335px;
}
.alert--popup .alert--popup__actions .alert--btn:hover {
    color: #6ab0de;
}
.alert--popup__content.success i {
    background-position: -209px -351px;
}

.alert--popup__content.dialog i {
    background-position: -239px -351px;
}

.alert--popup__content.error i {
    background-position: -226px -351px;
}
/*notification end*/

/*react styles end*/

/* SWITCH SLIDER START */
.switch {
    position: relative;
    display: inline-block;
    width: 130px;
    height: 26px;
    float: left !important;
    margin-right: 0 !important;
}

.switch input.switch-input {
    opacity: 0;
    width: 0;
    height: 0;
}
.switch-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #6ab0d0;
    opacity: 0.7;
    -webkit-transition: .4s;
    transition: .4s;
}
.switch-slider:before {
    position: absolute;
    content: "";
    height: 22px;
    width: 22px;
    left: 2px;
    bottom: 2px;
    border-radius: 2px;
    background-color: #dfe6eb;
    -webkit-transition: .4s;
    transition: .4s;
}
.switch-slider div {
    padding: 5px 0 5px 30px;
    font-size: 12px;
    color: #fff;
    -webkit-transition: .4s;
    transition: .4s;
}
.switch-slider div:before {
    content: "Notification OFF";
}
input.switch-input:checked + .switch-slider {
    background-color: #6ab0de;
    opacity: 1;
}
input.switch-input:checked + .switch-slider div {
    padding-left: 15px;
    -webkit-transition: .4s;
    transition: .4s;
}
input.switch-input:checked + .switch-slider div:before {
    content: "Notification ON";
}
input.switch-input:focus + .switch-slider {
    box-shadow: 0 0 1px #30527c;
}

input.switch-input:checked + .switch-slider:before {
    -webkit-transform: translateX(104px);
    -ms-transform: translateX(104px);
    transform: translateX(104px);

}
/* SWITCH SLIDER END */

/*Edit Vehicle Project start*/
.add-information-popup.edit-vehicle {
    width: auto;
}
.add-information-popup.edit-vehicle .add-info-input {
    border: none;
    padding-bottom: 0;
    padding-right: 35px;
}
.add-information-popup.edit-vehicle .add-info-input.with-hint {
    padding-bottom: 14px;
}
.add-information-popup.edit-vehicle .action-panel {
    clear: both;
    overflow: hidden;
    padding-top: 20px;
}
.add-information-popup.edit-vehicle .header-panel .btn-holder {
    display: block;
}
.add-information-popup.edit-vehicle .header-panel .btn-holder .button {
    /*background: #03a4e4;*/
    float: left;
}
.add-information-popup.edit-vehicle .add-info-input label {
    padding-right: 5px;
}
.validation-ico {
    position: absolute;
    width: 12px;
    height: 10px;
    right: 19px;
    top: 50%;
    margin-top: -9px;
    visibility: hidden;
}
.validation-ico.ok {
    background-position: -260px -336px;
    visibility: visible;
}
.validation-ico.error {
    height: 11px;
    background-position: -259px -349px;
    visibility: visible;
}

.edit-veh-icon .select-icon {
    float: right;
    margin-right: 10px;
}
.edit-veh-icon .vehicle-icon-list-frame {
    border-top: 1px solid #999;
}
.edit-veh-icon .vehicle-icon-list-frame .title {
    display: inline-block;
    padding: 18px 0 10px 10px;
}
.edit-veh-icon .veh-icon-frame {
    padding: 8px 10px 0;
}
.edit-veh-icon .veh-img-frame {
    display: flex;
    align-items: center;
    padding: 15px 0 0 0;
    min-height: 64px;
}
.edit-veh-icon .veh-img-frame img {
    display: block;
}
.add-information-popup.edit-vehicle.edit-veh-icon {
    width: 482px;
}

.add-information-popup.edit-vehicle .scroll-content {
    height: 400px;
}
.add-information-popup.edit-vehicle .scrollbar {
    right: 1px;
    opacity: 0.5;
    z-index: 1;
}
.select-vehicle-icon-frame {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 10px 12px 0 10px;
}
.select-vehicle-icon-frame .validation-ico {
    top: 2px;
    left: 6px;
    margin-top: 0;
}
.select-vehicle-icon-frame .vehicle-icon.active .validation-ico.ok {
    visibility: visible;
}
.select-vehicle-icon-frame .validation-ico.ok {
    visibility: hidden;
}
.select-vehicle-icon-frame .vehicle-icon{
    width: 64px;
    height: 64px;
    border: 2px solid #e2e2e2;
    border-radius: 3px;
    justify-content: center;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    position: relative;
    cursor: pointer;
    margin-right: 10px;
}

.select-vehicle-icon-frame .vehicle-icon:nth-child(6n) {
    margin-right: 0;
}

.select-vehicle-icon-frame .vehicle-icon.active {
    border-color: #586974;
}

.circle-color-picker {
    padding: 18px 10px;
    border-top: 1px solid #999;
}
.circle-color-picker .circle-color-list {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding-top: 15px;
}
.circle-color-picker .circle-color {
    text-align: center;
    cursor: pointer;
}
.circle-color-picker .circle-color .circle {
    width: 32px;
    height: 32px;
    border-radius: 18px;
    border: 2px solid #e2e2e2;
    margin-bottom: 2px;
}
.circle-color-picker .circle-color.active .circle {
    border: 2px solid #586974;
}
.circle-color-picker .circle-color .circle.black {
    background: #000;
}
.circle-color-picker .circle-color .circle.white {
    background: #fff;
}
.circle-color-picker .circle-color .circle.red {
    background: #ff0000;
}
.circle-color-picker .circle-color .circle.green {
    background: #00b108;
}
.circle-color-picker .circle-color .circle.blue {
    background: #2457e7;
}
.circle-color-picker .circle-color .circle.yellow {
    background: #ffe400;
}
.circle-color-picker .circle-color .circle.purple {
    background: #dc00ca;
}
.circle-color-picker .circle-color .circle.special {
    background: #fff;
    position: relative;
    overflow: hidden;
}

.edit-veh-driver .select-driver-frame {
    display: flex;
    align-items: center;
    padding: 10px 10px 25px 10px;
}
.edit-veh-driver .select-driver-frame .select-holder select {
    width: 163px;
}
.edit-veh-driver .select-driver-frame .title {
    margin-right: 18px;
}

.circle-color .line {
    width: 47px;
    height: 2px;
    transform: translateY(15px) translateX(-8px) rotate(-45deg);
    -moz-transform: translateY(15px) translateX(-8px) rotate(-45deg);
    -webkit-transform: translateY(15px) translateX(-8px) rotate(-45deg);
    -o-transform: translateY(15px) translateX(-8px) rotate(-45deg));
    -ms-transform: translateY(15px) translateX(-8px) rotate(-45deg);
    position: absolute;
    background: #ff2929;
}

/*Edit Vehicle Project end*/

/* League Table start */
.report .control-panel ul > li{
    float: left;
    padding-right: 15px;
}
.report .control-panel form{
    float: left;
}
.report .control-panel ul > li {
    float: left;
    padding-right: 15px;
}
.report .control-panel{
    padding: 3px 0 3px 4px;
    overflow: hidden;
}
.report.league-table {
    max-width: 1340px;
    min-width: 1340px;
    height: auto;
}
.report.league-table ul.menu:before {
    border-bottom: 1px solid #dadcdd;
}
.report.league-table ul.menu li {
    padding-bottom: 10px;
    border-bottom: none;
    color: #000;
    background: #dadcdd;
}
.report.compact.league-table .info-holder>.info {
    border-bottom: none;
}
.league-table table.info {
    width: auto;
}
.league-table table.info tr:hover,
.table-key table.info tr:hover,
.exclude-driver table.info tr:hover {
    background: transparent !important;
}
.league-table table.info tr:hover td {
    color: #586974 !important;
}
.league-table table.info tr:nth-child(2n+1):hover,
.table-key table.info tr:nth-child(2n+1):hover,
.exclude-driver table.info tr:nth-child(2n+1):hover {
    background: #f7f8f8 !important;
}
.league-table table.info th.orange,
.table-key table.info td.orange {
    background: orange;
}
.league-table table.info th.red,
.table-key table.info td.red {
    background: red;
}
.league-table table.info thead td {
    background: #e8e7e7;
    border-bottom: 1px solid #999;
    text-align: center;
}
.league-table table.info thead td {
    width: 206px;
}
.league-table table.info thead tr:first-child th:nth-child(1) {
    width: 28px;
}
.league-table table.info thead tr:first-child th:nth-child(2) {
    width: 163px;
}
.league-table table.info thead tr:first-child th:nth-child(3) {
    width: 95px;
}
.league-table table.info thead tr:first-child th:nth-child(4) {
    width: 57px;
}
.league-table table.info thead tr:first-child th:nth-child(5) {
    width: 57px;
}
.league-table table.info tbody td {
    text-align: center;
    width: 38px;
}
.league-table table.info tbody td:nth-child(1) {
    width: 23px;
}
.league-table table.info tbody td:nth-child(2) {
    max-width: 158px;
    min-width: 158px;
    width: 158px;
}
.league-table table.info tbody td:nth-child(3) {
    max-width: 90px;
    min-width: 90px;
    width: 90px;
}
.league-table table.info tbody td:nth-child(4) {
    max-width: 52px;
    min-width: 52px;
    width: 52px;
}
.league-table table.info tbody td:nth-child(5) {
    max-width: 52px;
    min-width: 52px;
    width: 52px;
}

.league-table table.info tbody td:nth-child(-n+5) {
    text-align: left;
}

.league-table table.info thead tr:last-child th {
    padding: 7px 0 8px !important;
    text-align: center;
    width: 54px;
}
.league-table table.info .empty-row td:empty{
    padding: 7px 5px 8px 11px;
}

.simple-popup.exclude-driver,
.simple-popup.table-key {
    z-index: 103;
}
.simple-popup.exclude-driver {
    width: 430px;
}
.simple-popup.table-key {
    width: 826px;
}
.simple-popup.exclude-driver .scroll-content {
    height: 168px;
}
.simple-popup.exclude-driver .close-btn{
    margin-top: -24px;
}
.table-key table.info,
.exclude-driver table.info {
    border-top: none;
    border-bottom: none;
}
.table-key table.info tbody,
.exclude-driver table.info tbody {
    border-top: 1px solid #999;
}
.table-key table.info tbody td span {
    display: block;
    margin-top: 13px;
    color: #aaa;
}
.table-key table.info thead tr:first-child th:nth-child(1) {
    width: 52px;
}
.table-key table.info thead tr:first-child th:nth-child(2) {
    width: auto;
}
.exclude-driver table.info thead tr:first-child th:nth-child(1),
.exclude-driver table.info thead tr:first-child th:nth-child(2) {
    width: 203px;
}
.exclude-driver table.info td:nth-child(1) {
    width: 198px;
}
.table-key table.info td:nth-child(2) {
    border-right: none;
}
.exclude-driver table.info td:nth-child(2) {
    width: 198px;
    border-right: none;
}
/* League Table end */

/* Snail Trail Step Play */
input[type=range]:not(.cr-slider) {
    -webkit-appearance: none;
    width: 100%;
    margin: auto 0;
}
input[type=range]:not(.cr-slider):focus {
    outline: none;
}
input[type=range]:not(.cr-slider)::-webkit-slider-runnable-track {
    width: 100%;
    height: 3px;
    cursor: pointer;
    background: rgba(0, 0, 0, 0.15);
    border-radius: 1px;
    border: 1px solid rgba(1, 1, 1, 0);
}
input[type=range]:not(.cr-slider)::-webkit-slider-thumb {
    border: 0 solid rgba(0, 0, 0, 0);
    height: 12px;
    width: 12px;
    border-radius: 25px;
    background: #000;
    cursor: pointer;
    -webkit-appearance: none;
    margin-top: -5px;
}
input[type=range]:not(.cr-slider)::-webkit-slider-thumb:hover {
    background: #761517;
    width:13px;
    height: 13px;
}
input[type=range]:not(.cr-slider):focus::-webkit-slider-runnable-track {
    background: rgba(0, 0, 0, 0.15);
}
input[type=range]:not(.cr-slider)::-moz-range-track {
    width: 100%;
    height: 1px;
    cursor: pointer;
    background: rgba(0, 0, 0, 0.15);
    border-radius: 1px;
    border: 1px solid rgba(1, 1, 1, 0);
}
input[type=range]:not(.cr-slider)::-moz-range-thumb {
    border: 0px solid rgba(0, 0, 0, 0);
    height: 12px;
    width: 12px;
    border-radius: 25px;
    background: #000;
    cursor: pointer;
}
input[type=range]:not(.cr-slider)::-ms-track {
    width: 100%;
    height: 5px;
    cursor: pointer;
    background: transparent;
    border-color: transparent;
    color: transparent;
}
input[type=range]:not(.cr-slider)::-ms-fill-lower {
    background: #fff;
    border: 1px solid rgba(1, 1, 1, 0);
    border-radius: 2px;
}
input[type=range]:not(.cr-slider)::-ms-fill-upper {
    background: #fff;
    border: 1px solid rgba(1, 1, 1, 0);
    border-radius: 2px;
}
input[type=range]:not(.cr-slider)::-ms-thumb {
    border: 0px solid rgba(0, 0, 0, 0);
    height: 15px;
    width: 15px;
    border-radius: 25px;
    background: #fff;
    cursor: pointer;
    height: 4px;

}
input[type=range]:not(.cr-slider):focus::-ms-fill-lower {
    background: #fff;
}
input[type=range]:not(.cr-slider):focus::-ms-fill-upper {
    background: #fff;
}

.step-play {
    display: flex;
    background: #DADCDD;
    padding: 0 10px;
    height: 30px;
    align-items: center;
    justify-content: center;
}
.play-range {
    display: flex;
    align-self: center;
    width: 100%;
    margin: auto 15px;
}
.play-range .range {
    width: 100%;
    cursor: pointer;
}
.controller-holder {
    display: inline-flex;
    color: #000;
}
.controller-title {
    line-height: 25px;
    margin-right: 8px;
    align-self: center;
}
.controller-speed {
    margin: 0 8px;
    align-self: center;
}
.play-btn,
.stop-btn,
.fwd-btn,
.rwd-btn {
    margin: 5px 0;
    cursor: pointer;
    align-self: center;
}
.play-btn i,
.stop-btn i {
    width: 14px;
    height: 16px;
    display: block;
    background-position: -34px -382px;
}
.play-btn:hover i {
    background-position: -34px -400px;
}
.play-btn.active i {
    background-position: -17px -382px;
}
.play-btn.active:hover i {
    background-position: -17px -400px;
}
.stop-btn {
    margin-left: 15px;
}
.stop-btn i {
    background-position: -1px -382px;
}

.stop-btn:hover i {
    background-position: -1px -400px;
}

.fwd-btn i,
.rwd-btn i {
    width: 14px;
    height: 14px;
    display: block;
}
.fwd-btn i {
    background-position: -52px -383px;
}
.fwd-btn:hover i {
    background-position: -52px -401px;
}
.rwd-btn i {
    background-position: -68px -383px;
}
.rwd-btn:hover i {
    background-position: -68px -401px;
}
.fwd-btn.disabled,
.rwd-btn.disabled {
    pointer-events: none;
    opacity: 0.5;
}
/* Snail Trail Step Play End */

/* Camera Events */
.popup.smart-witness-camera {
    height: 390px;
    width: 640px;
}

.popup.smart-witness-camera #swc-timeline {
    padding: 10px;
}
.popup.smart-witness-camera .player-wrapper {
    position: relative;
    height: calc(100% - 30px);
}
.popup.smart-witness-camera .player-wrapper .player-control {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px;
}
.popup.event-video-player {
    position: absolute;
    height: 390px;
    width: 640px;
    z-index: 101;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.6);
    background: #000;
    display: block;
    overflow: hidden;
}
.popup.event-video-player .video-player {
    display: block;
}
.popup.event-video-player .player-control {
    position: absolute;
    bottom: -40px;
    left: 0;
    width: calc(100% - 30px);
    height: 40px;
    padding: 0 15px;
    background: rgba(10,10,10,.3);
}
.popup.event-video-player .player-control .vp-progress-line-container {
    position: absolute;
    bottom: 40px;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: calc(100% - 30px);
    height: 7%;
    outline: 0;
    border-radius: 10px;
    background-color: hsla(0, 0%, 98%, 0.6);
    cursor: pointer;
}
.popup.event-video-player .player-control .vp-progress-line-container .vp-play-progress {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    -ms-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    z-index: 104;
    -webkit-transform: scaleX(0);
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    background-color: red;
}
.popup.event-video-player .player-control .vp-progress-line-container:hover {
    opacity: 0.5;
    height: 15%;
}
.popup.event-video-player .player-control .dd-wrapper {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    bottom: -8px;
    right: -130px;
    width: 115px;
    background: hsla(0, 0%, 39%, 0.6);
    color: #fff;
    border-color: #fff;
}
.popup.event-video-player .player-control .dd-wrapper .dd-header .dd-header-title {
    color: #fff;
}
.popup.event-video-player .player-control .dd-wrapper .dd-list-item {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    float: none;
    color: #444;
}
.popup.event-video-player .player-control .dd-wrapper .dd-list-item div {
    position: relative;
    margin-right: 25px;
}
.popup.event-video-player .player-control .vp-time-tracker {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    bottom: 13px;
    right: 75px;
    color: #fff;
}
.popup.event-video-player .player-control .vp-time-tracker p {
    margin: 0 5px;
}
.popup.event-video-player .player-control .vp-time-tracker span {
    font-weight: lighter;
}
.popup.event-video-player .player-control .vp-volume-container {
    position: absolute;
    bottom: 32px;
    left: 45px;
    outline: 0;
    cursor: pointer;
}
.popup.event-video-player .player-control .vp-volume-container .vp-volume-btn {
    position: relative;
}
.popup.event-video-player .player-control .vp-volume-container .vp-volume-btn i {
    display: block;
    top: 0;
    left: 0;
    width: 18px;
    height: 18px;
    position: absolute;
    background-position: -21px -21px;
}
.popup.event-video-player .player-control .vp-volume-container .vp-volume-mute-btn {
    position: relative;
}
.popup.event-video-player .player-control .vp-volume-container .vp-volume-mute-btn i {
    display: block;
    top: 0;
    left: 0;
    width: 18px;
    height: 18px;
    position: absolute;
    background-position: -65px -21px;
}
.popup.event-video-player .player-control .vp-volume-container .vp-volume-line-container {
    width: 64px;
    height: 100%;
    position: absolute;
    left: 25px;
    top: -10px;
}
.popup.event-video-player .player-control .vp-volume-container .vp-volume-line-container .vp-volume-line .vp-volume-slider {
    height: 100%;
    min-height: 35px;
    position: relative;
    overflow: hidden;
}
.popup.event-video-player .player-control .vp-volume-container .vp-volume-line-container .vp-volume-line .vp-volume-slider .vp-slider-handle {
    position: absolute;
    top: 50%;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    margin-top: -4px;
    background: #fff;
}
.popup.event-video-player .player-control .vp-volume-container .vp-volume-line-container .vp-volume-line .vp-volume-slider .vp-slider-handle:before {
    left: -58px;
    background: #fff;
}
.popup.event-video-player .player-control .vp-volume-container .vp-volume-line-container .vp-volume-line .vp-volume-slider .vp-slider-handle:after {
    left: 6px;
    background: hsla(0, 0%, 100%, 0.2);
}
.popup.event-video-player .player-control .vp-action-btn {
    position: absolute;
    bottom: 30px;
    left: 15px;
    outline: 0;
    cursor: pointer;
}
.popup.event-video-player .player-control .vp-action-btn .vp-play-btn,
.popup.event-video-player .player-control .vp-action-btn .vp-stop-btn {
    position: relative;
}
.popup.event-video-player .player-control .vp-action-btn .vp-play-btn i,
.popup.event-video-player .player-control .vp-action-btn .vp-stop-btn i {
    display: block;
    top: 0;
    left: 0;
}
.popup.event-video-player .player-control .vp-action-btn .vp-play-btn i {
    width: 11px;
    height: 14px;
    position: absolute;
    background-position: -130px -2px;
}
.popup.event-video-player .player-control .vp-action-btn .vp-play-btn i:hover {
    background-position: -117px -2px;
}
.popup.event-video-player .player-control .vp-action-btn .vp-stop-btn i {
    width: 14px;
    height: 14px;
    position: absolute;
    background-position: -100px -2px;
}
.popup.event-video-player .player-control .vp-action-btn .vp-stop-btn i:hover {
    background-position: -84px -2px;
}
.popup.event-video-player .player-control .vp-download-action {
    position: absolute;
    bottom: 30px;
    right: 65px;
    outline: 0;
    cursor: pointer;
}
.popup.event-video-player .player-control .vp-download-action .vp-download-btn {
    position: relative;
}
.popup.event-video-player .player-control .vp-download-action .vp-download-btn i {
    display: block;
    top: 0;
    left: 0;
    width: 22px;
    height: 18px;
    position: absolute;
    background-position: -25px -1px;
}
.popup.event-video-player .player-control .vp-download-action .vp-download-btn i:hover {
    background-position: -1px -1px;
}
.popup.event-video-player .player-control .vp-fs-btn {
    position: absolute;
    bottom: 30px;
    right: 33px;
    outline: 0;
    cursor: pointer;
}
.popup.event-video-player .player-control .vp-fs-btn .vp-fullscreen-btn {
    position: relative;
}
.popup.event-video-player .player-control .vp-fs-btn .vp-fullscreen-btn i {
    display: block;
    top: 0;
    left: 0;
    width: 16px;
    height: 16px;
    position: absolute;
    background-position: -67px -1px;
}
.popup.event-video-player .player-control .vp-fs-btn .vp-fullscreen-btn i:hover {
    background-position: -49px -1px;
}
.popup.event-video-player .player-control .vp-fs-btn .vp-exit-fullscreen-btn {
    position: relative;
}
.popup.event-video-player .player-control .vp-fs-btn .vp-exit-fullscreen-btn i {
    display: block;
    top: 0;
    left: 0;
    width: 16px;
    height: 16px;
    position: absolute;
    background-position: -127px -41px;
}
.popup.event-video-player .player-control .vp-fs-btn .vp-exit-fullscreen-btn i:hover {
    background-position: -109px -41px;
}
.popup.event-video-player .vp-request .popup.request-video {
    left: 180px;
    top: 120px;
    cursor: auto;
}
.popup.event-video-player .vp-downloading {
    position: absolute;
    color: #fff;
    bottom: 30px;
    line-height: 30px;
    font-size: 16px;
    left: 0;
    right: 0;
    text-align: center;
}
.vis-item.vis-box,
.vis-item.vis-dot,
.vis-item.vis-line {
    border-color: red !important;
    z-index: 999;
}
.vis-item.vis-range {
    border-color: transparent !important;
}
.vis-item.vis-box {
    border-style: none !important;
    background-color: transparent !important;
}
.vis-item.vis-box .vis-item-content {
    padding: 0;
}
.smart-witness-camera {
    max-width: calc(100vw - (64px + 40px));
    width: auto;
    min-width: 1116px;
    height: auto;
    left: 0;
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4);
    z-index: 100;
    display: block;
}
.smart-witness-camera .swc-form-container {
    padding: 6px 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.smart-witness-camera .swc-form-container form {
    display: flex;
    align-items: center;
}
.smart-witness-camera .swc-form-container .swc-date-container span {
    color: #fff;
}
.smart-witness-camera .swc-form-container .swc-date-container .range {
    margin-left: 10px;
}
.smart-witness-camera .swc-form-container .swc-date-container .range span,
.smart-witness-camera .swc-form-container .swc-date-container .range,
.smart-witness-camera .swc-form-container .swc-date-container .date,
.smart-witness-camera .swc-form-container .swc-date-container .time {
    float: none;
    overflow: visible;
}
.smart-witness-camera .swc-form-container .swc-date-container .range > span {
    vertical-align: middle;
    padding-right: 10px;
    line-height: 24px;
    color: #586974;
}
.smart-witness-camera .swc-form-container .swc-date-container .range .date {
    position: relative;
    box-shadow: inset 0 0 2px 0 rgb(0 0 0 / 10%);
    border: 1px solid #999;
    background: #fff;
}
.smart-witness-camera .swc-form-container .swc-date-container .range .date > input {
    color: #586974;
    background: #fff;
    width: 120px;
    padding: 6px 9px;
    height: 12px;
    font-size: 12px;
}
.smart-witness-camera.report .date {
    padding-left: 0;
}
.smart-witness-camera .swc-form-container .swc-date-container .button {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-left: 10px;
}
.smart-witness-camera .swc-form-container .swc-right-actions-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: right;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    align-items: center;
}
.smart-witness-camera .swc-form-container .swc-right-actions-container .button {
    margin-left: 7px;
}
.swc-configure-popup {
    display: none;
    position: absolute;
    width: 330px;
    top: 70px;
    right: 0;
    background: #fff;
    z-index: 501;
    box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.4);
}
.swc-configure-popup::before {
    content: '';
    position: absolute;
    background: #dfe6eb;
    right: 14%;
    top: -3px;
    margin-left: -3px;
    width: 7px;
    height: 7px;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    z-index: -1;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.swc-configure-popup .swc-configure-content {
    color: #586974;
    padding: 10px 10px 0;
    height: 220px;
}
.swc-configure-popup .swc-configure-content .configure-tools {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column wrap;
    flex-flow: column wrap;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    height: 100%;
}
.swc-configure-popup .swc-configure-content .configure-tools label {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    float: none;
    margin: 9px 0 4px;
    width: 145px;
}
.swc-configure-popup .swc-configure-content .configure-tools label .checkbox {
    margin-right: 6px;
}
.swc-configure-popup .swc-configure-content .configure-tools label.disabled {
    color: #999;
}
.swc-configure-popup.active {
    display: block;
}
.swc-notifications-popup {
    display: none;
    position: absolute;
    width: 290px;
    top: 70px;
    right: 10px;
    background: #fff;
    z-index: 501;
    box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.4);
}
.swc-notifications-popup::before {
    content: '';
    position: absolute;
    background: #dfe6eb;
    left: 55%;
    top: -3px;
    margin-left: -3px;
    width: 7px;
    height: 7px;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.5);
    z-index: -1;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.swc-notifications-popup .swc-notifications-content {
    padding: 10px 10px 0;
    height: 295px;
}
.swc-notifications-popup .swc-notifications-content .notifications-label {
    color: #586974;
    font-weight: 700;
    margin-bottom: 3px;
}
.swc-notifications-popup .swc-notifications-content .notifications-tools {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column wrap;
    flex-flow: column wrap;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    padding-bottom: 20px;
}
.swc-notifications-popup .swc-notifications-content .notifications-tools label {
    color: #586974;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    float: none;
    margin: 9px 0 4px;
}
.swc-notifications-popup .swc-notifications-content .notifications-tools label .checkbox {
    margin-right: 6px;
}
.swc-notifications-popup .swc-notifications-content .notifications-tools .input-row {
    width: 52px;
    margin: -2px 0 0;
}
.swc-notifications-popup .swc-notifications-content .notifications-tools .input-row label {
    height: 16px;
    margin: 0;
    padding-left: 4px;
}
.swc-notifications-popup .swc-notifications-content .notifications-tools .input-row .input-holder input {
    padding: 2px 0;
}
.swc-notifications-popup .swc-notifications-content .notifications-tools .input-row .input-holder.counter .arrow-holder .arrow-down,
.swc-notifications-popup .swc-notifications-content .notifications-tools .input-row .input-holder.counter .arrow-holder .arrow-up {
    padding: 2px 4px;
}
.swc-notifications-popup.active {
    display: block;
}
.popup.request-video {
    display: block;
    height: auto;
    position: absolute;
    width: 280px;
    z-index: 110;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.6);
    background: #fff;
}
.popup.request-video .rv-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 10px;
}
.popup.request-video .rv-content span {
    line-height: 24px;
}
.popup.request-video .rv-content .rv-channels {
    display: inline;
    position: relative;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}
.popup.request-video .rv-content .rv-channels .rv-channels-elem {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    float: none;
    margin: 9px 0 4px;
    width: 130px;
}
.popup.request-video .rv-content .rv-channels .rv-channels-elem div {
    position: relative;
    margin-right: 25px;
}
.popup.request-video .rv-content .rv-channels .rv-channels-elem label {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    float: none;
}
.popup.request-video .rv-content .rv-channels .rv-channels-elem label.disabled {
    cursor: not-allowed;
    color: #999;
}
.popup.request-video .rv-content .rv-channels .rv-channels-elem label span {
    margin-right: 6px;
}
.popup.request-video .rv-content .rv-channels .rv-channels-elem label span.disabled {
    cursor: not-allowed;
    opacity: 0.6;
}
.report.smart-witness-camera label .checkbox {
    margin-right: 0;
}
.report.smart-witness-camera label .checkbox.disabled {
    opacity: 0.6;
}
.report.smart-witness-camera label {
    margin-right: 0;
    float: none;
    line-height: inherit;
}

table.info tr.empty-row {
    height: 28px;
}
/*table.info td:last-child {*/
/*    border-right: none;*/
/*}*/
table.info td .delete,
table.info td .edit {
    cursor: pointer;
    display: inline-block;
}
table.info td .edit {
    width: 16px;
    height: 16px;
    background-position: -154px -319px;
}
table.info td .edit:hover {
    background-position: -154px -336px;
}
table.info td .delete {
    width: 15px;
    height: 17px;
    background-position: -211px -309px;
}
table.info td .delete:hover {
    background-position: -211px -328px;
}
table.info td.with-icons {
    position: relative;
}
.table-drop {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 114px;
    background: #fff;
    z-index: 10000;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
    white-space: nowrap;
}
.table-drop > ul {
    border-collapse: collapse;
    overflow: hidden;
}
.table-drop > ul > li {
    display: block;
    cursor: pointer;
}
.table-drop > ul > li .title,
.table-drop > ul > li span {
    display: table-cell;
    font-size: 11px;
    color: #424242;
}
.table-drop > ul > li span:first-child {
    padding: 6px 7px 8px 4px;
    position: relative;
}
.table-drop > ul > li span.checkbox {
    padding: 0;
}
.table-drop > ul > li.groups-filter {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.table-drop > ul > li.groups-filter > span {
    padding: 5px 4px 1px;
}
.table-drop > ul > li.groups-filter > span label {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.table-drop > ul > li .title {
    padding-right: 4px;
}

.table-drop > ul > li:hover .title .top-border,
.table-drop > ul > li:hover > span .top-border {
    display: block;
}
.table-drop .top-border {
    position: absolute;
    top: 0;
    left: 0;
    width: 200px;
    height: 1px;
    display: none;
    background: #8b8b8b;
}
.table-drop .icon-wrap {
    padding: 6px;
}
.table-drop .table-sub-drop {
    position: absolute;
    top: 48px;
    left: 112px;
    background: #fff;
    padding: 7px;
    min-width: 137px;
    width: 100%;
    display: none;
    color: #000;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
    white-space: nowrap;
}
.table-drop .table-sub-drop .input-holder {
    padding-left: 5px;
}
.table-drop .table-sub-drop .input-holder input {
    width: 100%;
}
.table-drop .table-sub-drop li span {
    white-space: nowrap;
}
.table-drop .table-sub-drop .input-holder,
.table-drop .table-sub-drop .select-holder {
    margin-bottom: 8px;
    margin-top: 3px;
}
.sub-group .table-sub-groups {
    position: absolute;
    top: 74px;
    left: 0;
    background: #fff;
    padding: 4px 0 0 4px;
    width: 110px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color: #000;
    box-shadow: 0 0 2px 0 rgba(0,0,0,.3);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -ms-flex-flow: wrap;
    flex-flow: wrap;
    flex-direction: column;
}
.sub-group .table-sub-groups li,
.sub-group .table-sub-groups label {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.sub-group .table-sub-groups label {
    float: none;
    margin: 3px 0;
}
.sub-group .table-sub-groups .title {
    width: 88px;
    padding: 4px 0 0;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.report.smart-witness-camera .sub-group .table-sub-groups label span {
    margin-right: 7px;
}
.input-holder,
textarea {
    box-shadow: inset 0 0 2px 0 rgba(0, 0, 0, 0.1);
    border: 1px solid #999;
    background: #fff;
}
.table-icon.groups-filter i {
    display: block;
    margin: 0 auto;
}
.table-icon.groups-filter i {
    position: absolute;
    right: 0;
    top: 0;
    width: 15px;
    height: 15px;
    background-position: -170px -236px;
}

.table-icon.video i,
.table-icon.video-available i,
.table-icon.video-uploaded i,
.table-icon.video-getting i,
.table-icon.image i {
    display: block;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 16px;
    height: 16px;
    margin: auto;
}

.table-icon.video i{
    position: absolute;
    background-position: -109px -19px;
}
.table-icon.video-available i {
    position: absolute;
    background-position: -143px -1px;
}
.table-icon.video-uploaded i {
    position: absolute;
    background-position: -160px -1px;
}
.table-icon.video-getting i{
    position: absolute;
    background-position: -177px -1px;
}
.table-icon.image i {
    position: absolute;
    background-position: -126px -19px;
}
.report.smart-witness-camera .calendar-btn {
    position: absolute;
    right: 0;
    top: 0;
    padding: 5px 6px 6px;
    cursor: pointer;
}
.report.smart-witness-camera .calendar-btn i {
    display: block;
    width: 13px;
    height: 13px;
    background-position: -70px -308px;
}
.report.smart-witness-camera .calendar-btn .active {
    background: #2e70aa;
    border-color: #2e70aa;
}
.report.smart-witness-camera .calendar-btn .active i {
    background-position: -85px -308px;
}

/* Driver-Manager-React start */
#driver-manager {
    width: 100%;
    height: 100vh;
}
.popup.manage-drivers {
    display: block;
    height: auto;
    width: 940px;
    z-index: 9;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.6);
    background: #fff;
}
.popup.manage-drivers .info-holder {
    border-bottom: 1px solid grey;
}
.popup.manage-drivers .info-holder .table-profile-image {
    width: 24px;
    height: 24px;
}
.popup.manage-drivers .info-holder .with-photo {
    padding: 1px 4px 1px 7px;
    text-align: center;
}


.popup.manage-drivers .with-icons {
    text-align: center;
    padding: 3px 5px 3px 6px;
}

.popup.manage-drivers .popup.upload-image {
    position: absolute;
    top: 70px;
    left: 250px;
    display: block;
    height: auto;
    width: 440px;
    z-index: 102;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.6);
    background: #fff;
}
.popup.manage-drivers .popup.upload-image .upload-image-container {
    position: relative;
    height: 270px;
    margin: 10px;
}
.popup.driver-profile {
    position: absolute;
    top: 20px;
    left: 300px;
    display: block;
    height: auto;
    width: 340px;
    z-index: 101;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.6);
    background: #fff;
}
.react-draggable .popup.driver-profile .popup-header .header-title,
.react-draggable .popup.upload-image .popup-header .header-title {
    cursor: default;
}
.popup-header .header-title {
    color: #586974;
}
.minimize > .popup-header .header-title {
    color: #fff;
}
.minimize > .popup-header .close-btn i {
    background-position: -56px -334px;
}

.popup.driver-profile .input-row {
    margin: 5px 28px 5px 8px;
}
.popup.driver-profile .input-row .user-image {
    margin-left: 48px;
}
.popup.driver-profile .input-row > span {
    -webkit-box-flex: 2;
    -ms-flex: 2;
    flex: 2;
}
.popup.driver-profile .input-row > div:not(.user-image),
.popup.driver-profile .input-row > label {
    -webkit-box-flex: 3;
    -ms-flex: 3;
    flex: 3;
}
.popup.driver-profile .input-row:first-child {
    display: inline-block;
    margin-top: 10px;
}
.popup.driver-profile .input-row:first-child > span {
    vertical-align: top;
}
.popup.driver-profile .dd-checkbox .dd-list-item {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.popup.driver-profile .dd-checkbox .dd-list-item label {
    -webkit-box-flex: 0;
    -ms-flex: 0;
    flex: 0;
    margin-right: 8px;
}
.popup.driver-profile .dd-checkbox .dd-list-item span {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
/* Driver-Manager-React end */

#dkm {
    width: 100%;
    height: 100vh;
}
.popup.dallas-key-manager {
    height: auto;
    width: 400px;
    z-index: 101;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.6);
    display: block;
}
.popup.dallas-key-manager .info-holder {
    border-bottom: 1px solid grey;
}


.popup.dallas-key-manager .with-icons {
    text-align: center;
    padding: 3px 5px;
}

.popup.dallas-key-editor {
    position: absolute;
    top: 50px;
    left: 450px;
    display: block;
    height: auto;
    width: 240px;
    z-index: 101;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.6);
    background: #fff;
}
.popup.dallas-key-editor .input-row,
.popup.tachograph-key-editor .input-row {
    margin: 5px 8px;
}
.popup.dallas-key-editor .input-row > span,
.popup.tachograph-key-editor .input-row > span {
    -ms-flex: 2;
    flex: 2;
}
.popup.dallas-key-editor .input-row > div:not(.user-image),
.popup.dallas-key-editor .input-row > label,
.popup.tachograph-key-editor .input-row > div:not(.user-image),
.popup.tachograph-key-editor .input-row > label {
    -ms-flex: 2;
    flex: 2;
}
.popup.dallas-key-editor .input-row:first-child,
.popup.tachograph-key-editor .input-row:first-child {
    margin-top: 10px;
}
.popup.dallas-key-editor .input-row:first-child > span,
.popup.tachograph-key-editor .input-row:first-child > span {
    vertical-align: top;
}
.popup.dallas-key-editor .dd-checkbox .dd-list-item,
.popup.tachograph-key-editor .dd-checkbox .dd-list-item {
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.popup.dallas-key-editor .dd-checkbox .dd-list-item label,
.popup.tachograph-key-editor .dd-checkbox .dd-list-item label {
    -ms-flex: 0;
    flex: 0;
    margin-right: 8px;
}
.popup.dallas-key-editor .dd-checkbox .dd-list-item span,
.popup.tachograph-key-editor .dd-checkbox .dd-list-item span {
    -ms-flex: 1;
    flex: 1;
}
#tkm {
    width: 100%;
    height: 100vh;
}
.popup.tachograph-key-manager {
    height: auto;
    width: 400px;
    z-index: 101;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.6);
    display: block;
}
.popup.tachograph-key-manager .info-holder {
    border-bottom: 1px solid grey;
}


.popup.tachograph-key-manager .with-icons {
    text-align: center;
    padding: 3px 5px;
}

.popup.tachograph-key-editor {
    position: absolute;
    top: 50px;
    left: 450px;
    display: block;
    height: auto;
    width: 240px;
    z-index: 101;
    box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.6);
    background: #fff;
}
.popup.manage-drivers .scrollbar--view,
.popup.dallas-key-manager .scrollbar--view,
.popup.tachograph-key-manager .scrollbar--view,
.multi-camera .scrollbar--view{
    margin-right: -6px !important;
    margin-bottom: -17px !important;
}

/* Image Driver start */
.user-image {
    position: relative;
    width: 80px;
    height: 80px;
    display: inline-block;
    vertical-align: middle;
}
.user-image #default-profile-img {
    width: 100%;
    height: 100%;
}
.user-image .add-profile-image {
    width: 100%;
    height: 100%;
    background: rgba(90, 90, 90, 0.6);
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
    text-align: center;
    opacity: 0;
    transition: opacity 0.7s;
}
.user-image .add-profile-image span {
    position: absolute;
    top: 43%;
    left: 0;
    right: 0;
    color: #fff;
    font-weight: bolder;
}
.user-image:hover .add-profile-image {
    opacity: 1;
    transition: opacity 0.7s;
}
.uploading-box {
    margin: 25px 30px;
    padding: 40px 0;
    border: 2px dashed #ddd;
    text-align: center;
    color: #aaa;
}
.uploading-box.is-dragover {
    background: #999;
    border-color: #fff;
    color: #fff;
}
.uploading-box strong {
    font-size: 20px;
}
.uploading-box .uploading-box-input label {
    color: #e2003b;
    text-decoration: underline;
    cursor: pointer;
}
.uploading-box .uploading-box-input p {
    margin: 30px 0;
}
.file-uploaded-preview {
    display: block;
}
.file-preview {
    padding: 0 5px 0 10px;
}
.file-preview .profile-file-preview {
    display: inline-block;
}
.file-preview .profile-file-preview > * {
    display: inline-block;
    vertical-align: middle;
}
.file-preview .profile-file-preview img {
    width: 40px;
    height: 40px;
    vertical-align: middle;
}
.file-preview .profile-file-preview span {
    margin-left: 5px;
    max-width: 260px;
    overflow: hidden;
}
/* Image Driver start */

/* Fleet Management Plus start */
#fleet-management {
    width: 100vw;
    height: 100vh;
}
.report.fleet-management-plus {
    display: block;
    height: auto;
    width: 1240px;
    left: 0;
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4);
    z-index: 100;
}
.report.fleet-management-plus .scrollbar--view {
    margin-bottom: -16px !important;
}
.report.fleet-management-plus .fleet-management-form {
    padding: 6px 10px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
    justify-content: flex-end;
}
.report.fleet-management-plus .fleet-management-form .fleet-management-actions-container {
    display: -ms-flexbox;
    display: flex;
    text-align: right;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.report.fleet-management-plus .fleet-management-form .fleet-management-actions-container .button {
    margin-left: 7px;
}
.report.fleet-management-plus .info-holder {
    width: auto;
}
.report.fleet-management-plus .info-holder table.info td {
    padding: 7px 0 8px 11px;
}
.report.fleet-management-plus .info-holder .info {
    width: 1240px;
}
.report.fleet-management-plus .info-holder .overflow-y {
    height: calc(100vh - 128px);
}
.report.fleet-management-plus .info th:last-child {
    border-right: 1px solid #545454;
}
.report.fleet-management-plus > div:last-child > div:last-child:not(.actions-row) {
    display: none;
}
.fmp-configure-popup {
    position: absolute;
    width: 800px;
    top: 70px;
    right: 0;
    background: #fff;
    z-index: 1;
    box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.4);
}
.fmp-configure-popup .fmp-configure-alerts {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 10px 10px 0;
    height: 100px;
    border-bottom: 1px solid #555;
}
.fmp-configure-popup .fmp-configure-alerts > div {
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    margin: 3px 0;
}
.fmp-configure-popup .fmp-configure-alerts > div .color-box {
    width: 24px;
    height: 24px;
    border-radius: 2px;
    margin: 0 5px;
}
.fmp-configure-popup .fmp-configure-alerts .overdue .color-box {
    background: #f59392;
}
.fmp-configure-popup .fmp-configure-alerts .not-overdue label {
    margin-right: 0;
}
.fmp-configure-popup .fmp-configure-alerts .not-overdue .color-box {
    background: #f6a25b;
}
.fmp-configure-popup .fmp-configure-alerts .others .color-box {
    margin-left: 134px;
    border: 1px solid #0b0c0c;
}
.fmp-configure-popup .fmp-configure-alerts .others .switch {
    margin-left: 10px;
    margin-right: 10px !important;
}
.fmp-configure-popup .fmp-configure-alerts .input-row {
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 52px;
}
.fmp-configure-popup .fmp-configure-alerts .input-row span {
    -ms-flex: none;
    flex: none;
    margin: 7px 0;
}
.fmp-configure-popup .fmp-configure-content {
    padding: 10px 10px 0;
    height: 160px;
}
.fmp-configure-popup .fmp-configure-content .configure-tools {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: column wrap;
    flex-flow: column wrap;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    height: 100%;
}
.fmp-configure-popup .fmp-configure-content .configure-tools label {
    display: -ms-inline-flexbox;
    display: inline-flex;
    float: none;
    margin: 9px 0 4px;
    width: 145px;
}
.fmp-configure-popup .fmp-configure-content .configure-tools label .checkbox {
    margin-right: 6px;
}
.fmp-configure-popup .fmp-configure-content .configure-tools label.disabled {
    color: #999;
}
.switch input.switch-input:checked + .switch-slider div.toggle-email-alert:before {
    content: "E-mail alert ON";
}
.switch input.switch-input:checked + .switch-slider div.others:before {
    content: "Show";
}
.switch-slider div.toggle-email-alert:before {
    content: "E-mail alert OFF";
}
.switch-slider div.others:before {
    content: "Hide";
}
.fmp-edit-odometer-popup,
.fmp-edit-vehicle-popup {
    display: block;
    position: absolute;
    width: 300px;
    top: 50px;
    left: 50px;
    background: #fff;
    z-index: 101;
    box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.4);
}
.fmp-edit-odometer-popup .row-edit,
.fmp-edit-vehicle-popup .row-edit {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-left: 5px;
    margin-bottom: 7px;
}
.fmp-edit-odometer-popup .row-edit.odo-input,
.fmp-edit-vehicle-popup .row-edit.odo-input {
    width: 200px;
}
.fmp-edit-odometer-popup .row-edit > .input-row,
.fmp-edit-vehicle-popup .row-edit > .input-row {
    margin: 0;
}
.fmp-edit-odometer-popup .row-edit > .input-row label,
.fmp-edit-odometer-popup .row-edit > .input-row span,
.fmp-edit-vehicle-popup .row-edit > .input-row label,
.fmp-edit-vehicle-popup .row-edit > .input-row span {
    width: 100px;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
}
.fmp-edit-odometer-popup .row-edit > .input-row .input-holder,
.fmp-edit-vehicle-popup .row-edit > .input-row .input-holder {
    padding-left: 0;
}
.fmp-edit-odometer-popup .row-edit > .input-row .input-holder.counter,
.fmp-edit-vehicle-popup .row-edit > .input-row .input-holder.counter {
    padding-right: 0;
}
.fmp-edit-odometer-popup .row-edit > .input-row .input-holder input,
.fmp-edit-vehicle-popup .row-edit > .input-row .input-holder input {
    padding-left: 6px;
}
.fmp-edit-odometer-popup .row-edit > .input-row .input-holder.disabled,
.fmp-edit-vehicle-popup .row-edit > .input-row .input-holder.disabled {
    background: hsla(0, 0%, 39%, 0.3);
}
.fmp-edit-odometer-popup .row-edit > span:first-child,
.fmp-edit-vehicle-popup .row-edit > span:first-child {
    width: 100px;
    padding-right: 0;
}
.fmp-edit-odometer-popup .row-edit > span:last-child,
.fmp-edit-vehicle-popup .row-edit > span:last-child {
    margin: auto auto auto 10px;
}
.fmp-edit-odometer-popup .fmp-edit-popup-content,
.fmp-edit-vehicle-popup .fmp-edit-popup-content {
    padding: 10px;
}
.fmp-edit-odometer-popup .fmp-edit-popup-content .range,
.fmp-edit-vehicle-popup .fmp-edit-popup-content .range {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 5px;
    float: none;
}
.fmp-edit-odometer-popup .fmp-edit-popup-content .range .react-datepicker-wrapper,
.fmp-edit-vehicle-popup .fmp-edit-popup-content .range .react-datepicker-wrapper {
    border: 1px solid #999;
}
.fmp-edit-odometer-popup .fmp-edit-popup-content .range .date > input,
.fmp-edit-vehicle-popup .fmp-edit-popup-content .range .date > input {
    width: 80px;
}
.fmp-edit-odometer-popup .fmp-edit-popup-content .fmp-edit-popup-content-border,
.fmp-edit-vehicle-popup .fmp-edit-popup-content .fmp-edit-popup-content-border {
    border-bottom: 1px solid grey;
}
.fmp-edit-odometer-popup {
    width: 360px;
}
.fmp-edit-odometer-popup .row-edit.odo-input {
    width: auto;
}
.fmp-edit-odometer-popup .row-edit.range > span {
    -ms-flex: 1;
    flex: 1;
}
.fmp-edit-odometer-popup .row-edit > .input-row {
    -ms-flex: 1;
    flex: 1;
    margin: 0;
}
.fmp-edit-odometer-popup .row-edit > .input-row label,
.fmp-edit-odometer-popup .row-edit > .input-row span {
    -ms-flex: 2;
    flex: 2;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
}
.fmp-edit-odometer-popup .row-edit > .input-row span {
    margin-right: 0;
    -ms-flex: 5;
    flex: 5;
}
.fmp-edit-odometer-popup .row-edit > .input-row label {
    margin-right: 5px;
    margin-left: 3px;
}
.fmp-edit-odometer-popup .fmp-edit-popup-content .range .react-datepicker-wrapper {
    -ms-flex: 1;
    flex: 1;
}
.input-holder-edit {
    position: absolute;
    right: 3px;
    top: 3px;
    cursor: pointer;
}
.input-holder-edit i {
    width: 16px;
    height: 16px;
    display: block;
    background-position: -154px -319px;
}
.input-holder-edit i:hover {
    background-position: -154px -336px;
}
/* Camera Project start */
.camera-ico {
    width: 16px;
    height: 16px;
    display: inline-block;
}
.camera-ico.video-uploaded-square {
    background-position: -160px -1px;
}
.camera-ico.video-uploading-square {
    background-position: -177px -1px;
}
.camera-ico.video-uploading,
.camera-ico.video-uploaded,
.table-icon.video-uploaded i,
.table-icon.video-getting i {
    width: 22px;
}
.camera-ico.no-video {
    background-position: -53px -440px;
}
.cameras-row label .camera-ico.no-video,
.cameras-row label .camera-ico.video-download {
    margin-right: 16px;
}
.camera-ico.video-uploaded,
.table-icon.video-uploaded i {
    background-position: -26px -440px;
}
.camera-ico.video-download {
    background-position: -74px -440px;
}
.advanced-activity-log td .camera-ico{
    margin-right: 7px;
}
.camera-ico.video-uploading,
.table-icon.video-getting i {
    background-position: 0 -440px;
}
.add-drop.confirm-video-request {
    width: 350px;
    z-index: 110;
}
.add-drop.confirm-video-request .row > span {
    padding-right: 10px;
}
.cameras-row {
    display: flex;
    padding-top: 10px;
}
.cameras-row label:nth-child(n+3) {
    padding-top: 10px;
}
.cameras-row label {
    display: flex;
    flex: 1;
    align-items: center;
}
.cameras-row label .checkbox,
.cameras-row label .camera-ico{
    margin-right: 10px;
}
.download-video-section {
    padding-bottom: 20px;
    padding: 15px 0 20px 0;
}
.camera-video .vp-container .video-player-message,
.event-video-player .vp-container .video-player-message {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    height: calc(100% - 30px);
    top: 30px;
    left: 0;
}
.camera-video .vp-container .video-player-message span,
.event-video-player .vp-container .video-player-message span {
    color: #fff;
    font-size: 14px;
    text-align: center;
    padding: 0 20% 40px;
}
.camera-video .vp-container .player-control {
    transition: 0.5s;
    bottom: -40px;
}
.camera-video .vp-container:hover .player-control {
    transition: 0.5s;
    bottom: 0;
}
.camera-video .vp-volume-slider .ui-slider-range,
.camera-video .vp-volume-slider .background-line {
    position: absolute;
    top: 18px;
    height: 3px;
    background: #fff;
}
.camera-video .vp-volume-slider .background-line {
    width: 100%;
    background: hsla(0, 0%, 100%, 0.2);
}
.camera-video .vp-volume-slider .ui-slider-handle {
    position: absolute;
    top: 50%;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    margin-top: -4px;
    background: #fff;
    margin-left: -6px;
}
.camera-video .ui-selectmenu-button {
    background: transparent;
}
.camera-video .ui-selectmenu-button .ui-icon {
    width: 9px;
    height: 6px;
    background-position: -12px -50px;
}
.camera-video .ui-selectmenu-menu ul li {
    display: flex;
    align-items: center;
    color: #444;
}
.camera-video .ui-selectmenu-menu ul li .camera-ico {
    margin-right: 5px;
}
.camera-video .ui-selectmenu-menu ul li:hover {
    background: #dadcdd;
}
.popup.event-video-player.camera-video .player-control .vp-volume-container .vp-volume-line-container .vp-volume-line .vp-volume-slider {
    overflow: visible;
}
.camera-video .player-control .vp-volume-container .vp-volume-btn i {
    margin-left: -6px;
}
.popup.event-video-player.camera-video .player-control .vp-progress-line-container .ui-slider-range {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    z-index: 104;
    background-color: red;
}
.popup.event-video-player.camera-video .player-control .vp-progress-line-container .ui-slider-handle {
    top: 0;
    height: 100%;
    visibility: hidden;
}
.popup.event-video-player.multi-camera .player-control .vp-download-action .vp-download-btn a {
    display: block;
    top: 0;
    left: 0;
    width: 22px;
    height: 18px;
    position: absolute;
    background-position: -25px -1px;
}
.popup.event-video-player.camera-video .player-control .select-holder {
    display: inline-flex;
    bottom: -8px;
    right: -240px;
    height: 24px;
    background: hsla(0, 0%, 39%, 0.6);
    border-color: #fff;
    position: relative;
}
.popup.event-video-player.camera-video .player-control .select-holder .ui-selectmenu-button {
    color: #fff;
}
.ui-selectmenu-menu ul li.ui-state-disabled {
    cursor: not-allowed;
}
.header-panel .vp-download-btn {
    padding: 2px;
    float: right;
}
.header-panel .vp-download-btn a {
    display: block;
    width: 22px;
    height: 18px;
    background-position: -25px -1px;
    cursor: pointer;
}
.header-panel .vp-fullscreen-btn,
.popup-header .vp-fullscreen-btn {
    padding: 2px;
    float: right;
}
.header-panel .vp-fullscreen-btn i,
.popup-header .vp-fullscreen-btn i {
    display: block;
    width: 16px;
    height: 16px;
    background-position: -25px -44px;
    cursor: pointer;
    margin-left: 7px;
}
.minimize .header-panel .vp-fullscreen-btn i,
.minimize .popup-header .vp-fullscreen-btn i {
    background-position: -67px -1px;
}
.popup.event-video-player.multi-camera {
    width: 70vw;
    height: 70vh;
}
.popup.event-video-player.multi-camera .header-panel {
    cursor: move;
}
.multi-camera .vp-container {
    display: flex;
    height: calc(100% - 32px);
}
.multi-camera .main-video-section {
    flex: 1 1 74%;
    position: relative;
}
.multi-camera .side-video-section {
    display: flex;
    flex: 1 1 26%;
    background-color: #fff;
}
.multi-camera .side-video-section .mini-video {
    background-color: #000;
    cursor: pointer;
    position: relative;
}
.multi-camera span.channel-name {
    position: absolute;
    padding: 5px 10px;
    color: #fff;
    background-color: rgba(0,0,0, 0.4);
    bottom: 8px;
    right: 155px;
}
.multi-camera .side-video-section .mini-video span.channel-name {
    bottom: 10px;
    right: 10px;
    opacity: 0;
    transition: 0.5s;
}
.multi-camera .vp-container:hover span.channel-name {
    opacity: 1;
    transition: 0.5s;
}
.multi-camera .side-video-section .mini-video.camera-ico {
    align-self: center;
}
.multi-camera .side-video-section .scroll-frame {
    display: flex;
    flex: 1;
    padding: 0;
    margin: 0;
}
.multi-camera .side-video-section .scrollbar {
    opacity: 0.5;
    right: 0;
    z-index: 1;
    display: none;
}
.multi-camera .side-video-section .mini-video.status {
    border: 3px solid #8b8b8b;
    background-color: #fff;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: default;
}
.multi-camera.minimize > .header-panel,
.multi-camera.minimize > .popup-header {
    position: absolute;
    width: calc(100% - 13px);
    z-index: 1;
    top: -32px;
    transition: 0.5s;
    background: rgba(0, 0, 0, 0) none;
}
.popup.event-video-player.multi-camera.minimize .header-panel {
    cursor: default;
}
.multi-camera.minimize > .header-panel .close-btn {
    background: none;
}
.multi-camera.minimize:hover .header-panel,
.multi-camera.minimize:hover .popup-header{
    top: 0;
    transition: 0.5s;
}
.multi-camera.minimize .vp-container {
    height: 100%;
}
.multi-camera.minimize .player-control .channel-name {
    display: none;
}
.popup.event-video-player.multi-camera.minimize {
    width: 500px !important;
    height: auto !important;
}
.popup.event-video-player.camera-video.multi-camera.minimize .player-control .select-holder {
    display: block;
}
.popup.event-video-player.camera-video.multi-camera .player-control .select-holder {
    position: absolute;
    right: 235px;
    bottom: 8px;
    display: none;
}
.popup.event-video-player.camera-video.multi-camera .side-video-section .scroll-content {
    width: 100%;
}
.multi-camera .fullscreen-active .side-video-section .mini-video {
    height: calc(100vh / 3) !important;
}
.multi-camera .popup.request-video  {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.multi-camera .add-drop.confirm-video-request {
    z-index: 1000000;
}
/* Camera Project end */

/* Spinner start */
.loader-frame {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    align-items: center;
    justify-content: center;
    display: flex;
    z-index: 1;
}
.loader-frame .lds-roller{
    padding-bottom: 0;
}
.lds-roller {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
    padding-bottom: 20px;
}
.lds-roller div {
    animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    transform-origin: 40px 40px;
}
.lds-roller div:after {
    content: " ";
    display: block;
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
    margin: -4px 0 0 -4px;
}
.lds-roller div:nth-child(1) {
    animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
    top: 63px;
    left: 63px;
}
.lds-roller div:nth-child(2) {
    animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
    top: 68px;
    left: 56px;
}
.lds-roller div:nth-child(3) {
    animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
    top: 71px;
    left: 48px;
}
.lds-roller div:nth-child(4) {
    animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
    top: 72px;
    left: 40px;
}
.lds-roller div:nth-child(5) {
    animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
    top: 71px;
    left: 32px;
}
.lds-roller div:nth-child(6) {
    animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
    top: 68px;
    left: 24px;
}
.lds-roller div:nth-child(7) {
    animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
    top: 63px;
    left: 17px;
}
.lds-roller div:nth-child(8) {
    animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
    top: 56px;
    left: 12px;
}
@keyframes lds-roller {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
/* Spinner end */

.smart-witness-camera table.info {
    border-bottom: none;
}

.smart-witness-camera .info-holder .table-icon i {
    position: relative;
    top: auto;
    left: auto;
    bottom: auto;
    right: auto;
}


.smart-witness-camera table.info td:last-child {
    border-right: 1px solid #999;
}
.smart-witness-camera .scrollbar--view {
 margin-right: -6px !important;
}

.popup.request-video .rv-content .rv-channels .rv-channels-elem.disabled {
    opacity: 0.5;
}

.react-datepicker__day--in-range,
.react-datepicker__day--in-selecting-range,
.react-datepicker__day--selected,
.react-datepicker__month-text--in-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__month-text--selected,
.react-datepicker__quarter-text--in-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__quarter-text--selected,
.react-datepicker__day--in-range:hover,
.react-datepicker__day--in-selecting-range:hover,
.react-datepicker__day--selected:hover,
.react-datepicker__month-text--in-range:hover,
.react-datepicker__month-text--in-selecting-range:hover,
.react-datepicker__month-text--selected:hover,
.react-datepicker__quarter-text--in-range:hover,
.react-datepicker__quarter-text--in-selecting-range:hover,
.react-datepicker__quarter-text--selected:hover,
.react-datepicker__header{
    background-color: #6ab0de;
}
.react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle,
.react-datepicker-popper[data-placement^="bottom"] .react-datepicker__triangle {
    border-bottom-color: #6ab0de;
}
.react-datepicker__current-month,
.react-datepicker__day-name{
    color: #fff;
}
.popup.event-video-player .fullscreen-active .player-control .vp-fs-btn .vp-fullscreen-btn i {
    background-position: -127px -41px;
}
.header-panel .vp-fullscreen-btn:hover i,
.popup-header .vp-fullscreen-btn:hover i {
    background-position: -90px -406px;
}

.scheduled-report-list table td .delete {
    background-position: -172px -321px;
}
.scheduled-report-list table td .delete:hover {
    background-position: -172px -357px;
}
.tabset-report-panel.proximity table.info th {
    padding-right: 0;
}
.tabset-report-panel.proximity .table-drop {
    min-width: 124px;
}
/* Camera Events snail trail start */
.popup.snail-trail-camera-events {
    width: auto;
    height: auto;
    display: block;
    z-index: 100;
    min-width: 660px;
    min-height: 380px;
    background: #fff;
    top: 10vh;
    left: 10vw;
}
.popup.snail-trail-camera-events .chart-list {
    overflow: auto;
    max-height: calc(100vh - 154px);
}
.popup.snail-trail-camera-events .chart-row {
    padding: 0 20px;
}
.react-tabs {
    background: #fff;
}
.react-tabs__tab-list {
    display: flex;
    background: #d6e2e6;
    border-bottom: 1px solid #b2b8bc;
    border-top: 1px solid #b2b8bc;
}
.react-tabs .react-tabs__tab {
    background-color: #d6e2e6;
}

.react-tabs .react-tabs__tab {
    padding: 5px;
    display: flex;
    border-right: 1px solid #839ab1;
}
.react-tabs .react-tabs__tab span {
    color: #586974;
}
.react-tabs .react-tabs__tab--selected {
    background: #acc4cd;
}
.popup.snail-trail-camera-events .scrollbar--view {
    margin-right: -6px !important;
}
.popup.snail-trail-camera-events .info-holder > table.info {
    border-bottom: none;
    border-top: none;
}
/* Camera Events snail trail end */

/* map common styles */
.MicrosoftMap .NavBar_Container.horizontal {
    right: 0 !important;
    left: auto !important;
    bottom: 30px !important;
}
.MicrosoftMap .NavBar_DropDown {
    right: 40px !important;
    left: auto !important;
    -webkit-transform-origin: bottom right !important;
    -moz-transform-origin: bottom right !important;
    -ms-transform-origin: bottom right !important;
}

/* Live video start*/
.vehicle-header .live-video {
    display: block;
    width: 22px;
    height: 17px;
    margin: 1px 8px 0 0;
}
.vehicle-header .btns-holder .live-video.active {
    background-position: -46px -463px;
}
.vehicle-header .live-video.available {
    background-position: 0 -463px;
}
.vehicle-header .live-video.no-video {
    background-position: -23px -463px;
}
.vehicle-header .live-video.bad-connection {
    background-position: -109px -463px;
    height: 20px;
}
.popup.live-video .player-control .vp-time-tracker {
    left: 41px;
    bottom: 15px;
}
.popup.event-video-player.live-video {
    top: 40px;
    left: calc((100vw - 640px) / 2);
}
.vjs-text-track-display {
    display: none;
}
/* Live video end*/
/* Show Veh. Reg.*/
.veh-reg{
    display: none;
    color: #000;
}
/* Show Veh. Reg.*/
/* Permissions+ */
.arrow-ico {
    width: 7px;
    height: 8px;
    background-position: -140px -173px;
}
.popup.user-manager-tree .box__height.veh-tree .tree__sub.is-o label .ico-holder span.arrow-ico,
.popup.user-manager-tree .box__height.veh-tree .tree__sub.is-o .tree__sub.is-o label .ico-holder span.arrow-ico,
.popup.user-manager-tree .box__height.veh-tree .tree__sub.is-o .tree__sub.is-o .tree__sub.is-o label .ico-holder span.arrow-ico{
    margin: 0 3px 0 1px;
    background-position: -147px -174px;
}
.popup.user-manager-tree .box__height.veh-tree .tree__sub.is-o .tree__sub label .ico-holder span.arrow-ico,
.popup.user-manager-tree .box__height.veh-tree .tree__sub.is-o .tree__sub.is-o .tree__sub label .ico-holder span.arrow-ico {
    margin: 0 3px 0 1px;
    background-position: -140px -174px;
}
/* Permissions+ */

/* Favorite Start */
.star-ico {
    width: 18px;
    height: 17px;
    display: block;
    background-position: -89px -464px;
}

.star-ico.active {
    background-position: -70px -464px;
}

.swc-date-container .switch.toggle-button {
    margin-left: 10px;
}

.swc-date-container .switch.toggle-button .switch-slider div {
    padding: 6px 0 6px 30px;
}
.smart-witness-camera .info-holder .star-ico {
    margin-right: 11px;
}
.toggle-button .switch-slider div:before {
    content: ""
}
.switch.toggle-button input.switch-input:checked + .switch-slider div:before {
    content: "";
}

/* Favorite End */
/* react slider start */
.horizontal-slider {
    width: 100%;
    max-width: 500px;
    height: 35px;
}
.horizontal-slider .example-track {
    background: #fff;
    top: 50%;
    height: 3px;
}
.horizontal-slider .example-track {
    top: 50%;
    height: 3px;
}
.horizontal-slider .example-thumb {
    top: 1px;
    width: 50px;
    height: 48px;
    line-height: 38px;
}
.example-track.example-track-1 {
    background: hsla(0, 0%, 100%, 0.2);
}
/* react slider end */

/*Audio start*/
.popup.event-video-player.camera-video .player-control .vp-volume-container .vp-volume-mute-btn i {
    left: -6px
}
/*Audio end*/
/* Watched/unwatched video start*/
.table-icon.video-uploaded.unwatched,
.camera-ico.video-uploaded.unwatched{
    position: relative;
}
.table-icon.video-uploaded.unwatched i::after {
    content: '';
    position: absolute;
    top: -1px;
    right: -2px;
    width: 8px;
    height: 8px;
    background: #ff0043;
    display: block;
    border-radius: 8px;
}

.camera-ico.video-uploaded.unwatched::after{
    content: '';
    position: absolute;
    top: -1px;
    left: 59px;
    width: 8px;
    height: 8px;
    background: #ff0043;
    display: block;
    border-radius: 8px;
}
.camera-ico.video-uploaded.unwatched::after {
    top: 0;
    left: 15px;
}
/* Watched/unwatched video end*/
/** CLUSTERING THING **/
.map-tools ul.modern-map-tools {
    background-color: rgb(235,235,235);
}
.map-tools .modern-map-tools .trace-btn.active,
.map-tools .modern-map-tools .trace-btn:hover,
.map-tools .modern-map-tools .clustering-btn.active,
.map-tools .modern-map-tools .clustering-btn:hover {
    color: #6ab0de;
}
.map-tools .modern-map-tools .clustering-btn,
.map-tools .modern-map-tools .trace-btn {
    color: #586974;
}
/** CLUSTERING THING **/
/** SVG MAP TOOLS **/
.svg-map-tools {
    color: #62727c;
}
.svg-map-tools.active,
.svg-map-tools:hover {
    color: #6ab0de;
    cursor: pointer;
}
.svg-inactive:hover,
.svg-inactive {
    color: #a0acb3;
}
.svg-menu-icon.svg-map-tools.icon-map-tools-tfl .ico {
    background-position: -109px -227px;
    display: inline-block;
    width: 6px;
    height: 3px;
    position: relative;
    margin: 0 0 2px 4px;
    top: -20px;
    left: 23px;
}
/** SVG MAP TOOLS **/

/*simple-popup start*/
.simple-popup{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
    background: #fff;
    display: none;
}
.simple-popup.defect-closed{
    width: 430px;
}
.simple-popup.defect-closed .comment{
    border-top: none;
}
.simple-popup.notes .note-text{
    padding: 18px 10px;
    min-width: 200px;
}
.simple-popup .section{
    padding: 14px 11px;
    border-top: 1px solid #e7e6e6;
}
.simple-popup .section.has-table-grid{
    padding: 14px 0 0 0;
}
.simple-popup .section.has-table-grid .title-wrap{
    padding-left: 11px;
}
.simple-popup .vehicle-defect-info li{
    padding-bottom: 6px;
}
.simple-popup .section:first-child{
    border-top: none;
    padding-bottom: 2px;
}
.simple-popup .section .title-wrap{
    padding-bottom: 7px;
}
.simple-popup .daily-check .status-marker{
    display: inline-block;
    width: 15px;
    height: 15px;

    vertical-align: middle;
    border-radius: 8px;
}
.simple-popup .daily-check .status-marker.checked{
    background: #0fa913;
}
.simple-popup .daily-check .status-marker.minor-defect{
    background: #ffa200;
}
.simple-popup .daily-check .status-marker.safety-critical-defect{
    background: red;
}
.simple-popup .daily-check .status-marker.not-applicable{
    background: blue;
}
.simple-popup .daily-check .hint{
    background: #fff;
    border: none;
    padding: 0;
    z-index: 1;
    max-width: 300px;
}
.simple-popup .daily-check .hint .hint-frame{
    background: #fff;
    padding: 1px 7px;
}
.simple-popup .daily-check .hint.tooltip-arrow::before,
.simple-popup .daily-check .hint.tooltip-arrow::after{
    background: #fff;
}
.simple-popup .daily-check li{
    line-height: 30px;
}
.simple-popup .daily-check span{
    vertical-align: middle;
}
/*simple-popup end*/
/*option-list start*/
.option-list fieldset{
    padding: 15px 9px 8px 9px;
}
.option-list ul{
    padding: 19px 0 23px;
}
.option-list ul li{
    overflow: hidden;
    padding-bottom: 9px;
}
.option-list .title a{
    text-decoration: none;
}
/*option-list end*/
label .radio{
    margin-right: 6px;
}
label .title{
    vertical-align: middle;
}
.hint{
    position: absolute;
    top: 0;
    left: 0;
    background: #f2ecc4;
    border: 1px solid #c5cf53;
    padding: 5px 10px 3px 10px;
    display: none;
}
.bottom-button-set{
    overflow: hidden;
}
/* add-comment start */
.user-comment fieldset{
    padding: 10px 9px;
}
.user-comment .char-count{
    font-size: 10px;
    color: #8f8f8f;
    vertical-align: sub;
}
.user-comment .char-count-wrap{
    float: right;
}
.user-comment .textarea-wrap{
    padding: 4px 0 7px 0;
}
/* add-comment end*/
/* comment start*/
.comment{
    padding: 13px 9px 10px 9px;
    border-top: 1px solid #e7e6e6;
}
.comment .comment-info{
    line-height: 14px;
}
.comment .comment-info b{
    padding-left: 2px;
}
.comment .comment-info i{
    float: right;
    font-size: 11px;
    color: #787878;
}
.comment .comment-text{
    padding-top: 7px;
}
.comment-button{
    background-position: -189px -375px;
    display: inline-block;
    width: 16px;
    height: 14px;
    cursor: pointer;
}
.daily-check .comment-button{
    margin-left: 8px;
}
.comment-button
.comment-button:hover{
    background-position: -189px -408px;
}

/*comment end*/
/* image url start */
.imgUrl-button {
    display: inline-block;
    width: 16px;
    height: 13px;
    background-position: -250px -494px;
}
.imgUrl-button:hover {
    background-position: -268px -494px;
}
/* image url end */
.multi-column{
    -moz-column-count: 2;
    -moz-column-gap: 20px;
    -webkit-column-count: 2;
    -webkit-column-gap: 20px;
    column-count: 2;
    column-gap: 20px;
}
/*vehicle-defect-details start*/
.vehicle-defect-details .signature{
    vertical-align: middle;
    padding-left: 4px;
}
.checklist-section {
    border-top: 1px solid #e7e6e6;
}
.checklist-section .title-wrap {
    padding: 14px 11px 7px;
}
.checklist-info {
    width: 100%;
    border-collapse: collapse;
}
.checklist-info td {
    padding: 5px 11px;
    border: 1px solid #999;
    /* border-collapse: collapse; */
}
.checklist-info td:first-child {
    width: 25%;
    border-left: 0;
}
.checklist-info td:last-child {
    width: 75%;
    border-right: 0;
}
/*vehicle-defect-details end*/
/*report compact start*/
.report.compact .info-holder>.info{
    border-bottom: none;
}
.report.compact .scrollbar{
    opacity: 0.5;
    right: 0;
    z-index: 1;
}
/*report compact end*/
.report.compact .info-holder .info.content{
    border-top: none;
}
/*vehicle-defect start*/
.report.vehicle-defect{
    width: auto;
    height: 0;
    min-width: 1300px;
}
.report.vehicle-defect .control-panel ul > li {
    padding-right: 5px;
}
.report.vehicle-defect .control-panel .input-holder,
.report.vehicle-defect .control-panel .ui-selectmenu-button {
    border: 1px solid rgba(34,84,127,0.7);
}
.report.vehicle-defect .control-panel .button {
    padding: 5px 13px;
}
.report.vehicle-defect table.info tr.empty-row td:empty {
    padding: 7px 5px 8px 11px !important;
}
.report.vehicle-defect th:first-child,
.report.vehicle-defect td:first-child{
    width: 7%;
}
.report.vehicle-defect th:nth-child(2),
.report.vehicle-defect td:nth-child(2){
    width: 7%;
}
.report.vehicle-defect th:nth-child(3),
.report.vehicle-defect td:nth-child(3){
    width: 6%;
}
.report.vehicle-defect th:nth-child(4),
.report.vehicle-defect td:nth-child(4){
    width: 7%;
}
.report.vehicle-defect th:nth-child(5),
.report.vehicle-defect td:nth-child(5){
    width: 8%;
}
.report.vehicle-defect th:nth-child(6),
.report.vehicle-defect td:nth-child(6){
    width: 13%;
}
.report.vehicle-defect th:nth-child(7),
.report.vehicle-defect td:nth-child(7){
    width: 6%;
}
.report.vehicle-defect th:nth-child(8),
.report.vehicle-defect td:nth-child(8){
    width: 7%;
}
.report.vehicle-defect th:nth-child(9),
.report.vehicle-defect td:nth-child(9){
    width: 6%;
}
.report.vehicle-defect th:nth-child(10),
.report.vehicle-defect td:nth-child(10){
    width: 4%;
}
.report.vehicle-defect th:nth-child(11),
.report.vehicle-defect td:nth-child(11){
    width: 7%;
}
.report.vehicle-defect th:nth-child(12),
.report.vehicle-defect td:nth-child(12){
    width: 8%;
}
.report.vehicle-defect th:nth-child(13),
.report.vehicle-defect td:nth-child(13){
    width: 3%;
}
.report.vehicle-defect th:nth-child(14),
.report.vehicle-defect td:nth-child(14){
    width: 5%;
}
.report.vehicle-defect th:nth-child(15),
.report.vehicle-defect td:nth-child(15){
    width: 6%;
}
/* UNCHECKED TABLE */
.report.vehicle-defect .unchecked-defects th:first-child,
.report.vehicle-defect .unchecked-defects td:first-child{
    width: 8%;
}
.report.vehicle-defect .unchecked-defects th:nth-child(2),
.report.vehicle-defect .unchecked-defects td:nth-child(2){
    width: 8%;
}
.report.vehicle-defect .unchecked-defects th:nth-child(3),
.report.vehicle-defect .unchecked-defects td:nth-child(3){
    width: 8%;
}
.report.vehicle-defect .unchecked-defects th:nth-child(4),
.report.vehicle-defect .unchecked-defects td:nth-child(4){
    width: 10%;
}
.report.vehicle-defect .unchecked-defects th:nth-child(5),
.report.vehicle-defect .unchecked-defects td:nth-child(5){
    width: 21%;
}
.report.vehicle-defect .unchecked-defects th:nth-child(6),
.report.vehicle-defect .unchecked-defects td:nth-child(6){
    width: 8%;
}
.report.vehicle-defect .unchecked-defects th:nth-child(7),
.report.vehicle-defect .unchecked-defects td:nth-child(7){
    width: 12%;
}
.report.vehicle-defect .unchecked-defects th:nth-child(8),
.report.vehicle-defect .unchecked-defects td:nth-child(8){
    width: 9%;
}
.report.vehicle-defect .unchecked-defects th:nth-child(9),
.report.vehicle-defect .unchecked-defects td:nth-child(9){
    width: 8%;
}
.report.vehicle-defect .unchecked-defects th:nth-child(10),
.report.vehicle-defect .unchecked-defects td:nth-child(10){
    width: 8%;
}
/* UNCHECKED TABLE END */
.report.vehicle-defect tr:hover .view-ico,
.report.vehicle-defect tr.active .view-ico{
    background-position: -227px -497px;
}
.report.vehicle-defect tr:hover .view-ico:hover,
.report.vehicle-defect tr.active .view-ico:hover {
    background-position: -206px -468px;
}
.report.vehicle-defect .view-ico,
.report.vehicle-defect .comment-button{
    margin-left: -5px;
}
.report.vehicle-defect tr:hover .lock-ico,
.report.vehicle-defect tr.active .lock-ico{
    background-position: -170px -423px;
}

.report.vehicle-defect tr:hover .comment-button,
.report.vehicle-defect tr.active .comment-button{
    background-position: -189px -407px;
}
.report.vehicle-defect tr:hover .comment-button:hover,
.report.vehicle-defect tr.active .comment-button:hover {
    background-position: -189px -390px;
}
.vdri-open {
    background: #f47575;
    /*color: #fff;*/
}
.vdri-closed {
    background: #8dda6e;
    /*color: #fff;*/
}
.comments.tooltip-arrow::after,
.comments.tooltip-arrow::before {
    left: 90%;
}
/*vehicle-defect end*/
/* Vehicle Defect Checklist */

/*view-ico start*/
.view-ico{
    display: inline-block;
    width: 17px;
    height: 10px;
    background-position: -226px -485px;
    cursor: pointer;
}
/*view-ico end*/
/*lock-ico start*/
.lock-ico{
    display: inline-block;
    width: 12px;
    height: 14px;
    background-position: -170px -407px;
    margin-left: 11px;
}
/*lock-ico end*/
/* css for datetimepicker */
.ui-timepicker-div{
    border-top: 1px solid #d9d9d9;
    padding: 0 13px 0 3px;
    color: #424242;
    background: #fff;
}
.ui-slider-handle{
    position: absolute;
    top: -5px;
    left: 0;
    width: 14px;
    height: 14px;
    background: #8f8f8f;
    outline: none;
    border-radius: 7px;
}
.ui-slider-handle:hover,
.ui-slider-handle:active{
    background: #df4444;
}
.ui-datepicker-buttonpane{
    padding: 14px 9px 8px 8px;
    overflow: hidden;
    background: #fff;
}
.ui-datepicker-buttonpane button{
    height: 26px;
    border: none;
    margin:0;
    padding: 0 13px;
    outline: none;
    color: #fff;
    font-size: 12px;
    background: #30527c;
}
.ui-datepicker-buttonpane button:hover{
    color: #03a4e4;
}
.ui-datepicker-buttonpane button:active{
    color: #fff;
    background: #15365f;
}
.ui-datepicker-buttonpane button:last-child{
    float: right;
}
.ui-timepicker-div .ui-widget-header {
    margin-bottom: 8px;
}
.ui-timepicker-div dl {
    text-align: left;
}
.ui-timepicker-div dl dd{
    margin: 9px 0 0 82px;
    overflow: hidden;
}
.ui-timepicker-div dl dt {
    float: left;
    clear:left;
    padding: 9px 0 0 5px;
}
.ui-timepicker-div dl{
    margin: 0;
}
.ui-timepicker-div,
.ui-timepicker-div dl{
    overflow: hidden;
}
.ui-tpicker-grid-label {
    background: none;
    border: none;
    margin: 0;
    padding: 0;
}
.ui_tpicker_hour,
.ui_tpicker_minute{
    height: 15px;
}
.ui_tpicker_hour_slider,
.ui_tpicker_minute_slider{
    position: relative;
    width: 104px;
    height: 4px;
    margin-top: 5px;
}
.slider-wrap{
    background: #dddddd;
}
.ui_tpicker_second,
.ui_tpicker_millisec,
.ui_tpicker_microsec,
.ui_tpicker_timezone{
    display: none;
}
/*datetimepicker end*/
.simple-popup.vehicle-defect-details{
    top: 50%;
    left: 50%;
    margin-left: -280px;
    width: 560px;
}
.simple-popup .header-panel {
    cursor: move;
}

.simple-popup.defect-image{
    top: 210px;
    left: 50%;
    margin-left: -240px;
    width: 480px;
    height: 334px;
    z-index: 4;
}
.simple-popup.defect-image a {
    text-decoration: none;
    float: right;
}
.image-body {
    width: 100%;
    text-align: center;
}
.image-body img {
    width: 100%;
    max-height: 300px;
    object-fit: contain;
}
.img-comment {
    display: none;
    position: absolute;
    top: 32px;
    left: 0;
    right: 0;
    padding: 5px 8px;
    background-color: #03a4e4;
    color: #fff;
}
.simple-popup.vehicle-defect-details .button {
    float: right;
    margin-right: 6px;
}
.simple-popup.notes {
    max-width: 400px;
    word-wrap: break-word;
}
.simple-popup.notes .header-panel .title {
    color: #fff;
}
[data-note] div, [data-closed] div {
    cursor: pointer;
}
.simple-popup.comments{
    width: 430px;
}
.simple-popup.comments .scrollbar{
    right: 0;
    opacity: 0.5;
    z-index: 1;
}
.simple-popup.status.tooltip-arrow:before,
.simple-popup.status.tooltip-arrow:after{
    top: -3px;
}

/*incidents start*/

.report .control-panel ul > li{
    float: left;
    padding-right: 15px;
}
.report .control-panel form{
    float: left;
}
.report.control-holder .line{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 32px;
    background: #ff0000;
    border-bottom: 1px #ff6666 solid;
}
.report .range,
.report .range span{
    float: left;
    overflow: hidden;
}
.report .date {
    padding-left: 13px;
}
.report .range span {
    line-height: 23px;
    color: #fff;
}
.report .range input {
    width: 104px;
}
.report .button.submit {
    float: right;
    margin-left: 5px;
}
/*.report .range .date {*/
/*position: relative;*/
/*overflow: hidden;*/
/*float: left;*/
/*}*/

.report .control-panel{
    background: #03a4e4;
    padding: 3px 0 3px 4px;
    overflow: hidden;
}
.report .control-panel .button{
    padding: 6px 13px;
}
/*incidents end*/
.veh-reg{
    display: none;
    color: #000;
}

/* Modal Window start */
.modal-layer {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.1);
}
.modal-layer-content {
    position: absolute;
    left: calc(50% - 500px);
    top: 50%;
    background-color: #fefefe;
    margin: auto;
}


.modal-layer.add-checklist .modal-layer-content {
    max-height: 593px;
    width: 1000px;
}
.modal-layer.vehiclelist .modal-layer-content {
    max-height: 530px;
    width: 1000px;
}
.modal-layer.checklists .modal-layer-content {
    height: 500px;
    width: 1120px;
    left: calc(50% - 560px);
}

.modal-layer.vehiclelist .info-holder {
    height: 485px;
}

.modal-layer.checklists .info-holder {
    height: 468px;
}
/* Modal Window end */

/* CHECKLISTS START */

.checklists table.info th:nth-child(1),
.checklists table.info th:nth-child(3),
.checklists table.info th:nth-child(5) {
    width: 136px;
}
.checklists table.info th:nth-child(2),
.checklists table.info th:nth-child(4) {
    width: 118px;
}
.checklists table.info th:nth-child(6) {
    width: 129px;
}
.checklists table.info th:nth-child(7) {
    width: 120px;
}
.checklists table.info th:nth-child(8),
.checklists table.info th:nth-child(9) {
    width: 60px;
}
.checklists table.info td:nth-child(1),
.checklists table.info td:nth-child(3),
.checklists table.info td:nth-child(5) {
    width: 131px;
}
.checklists table.info td:nth-child(2),
.checklists table.info td:nth-child(4) {
    width: 113px;
}
.checklists table.info td:nth-child(6) {
    width: 124px;
    text-transform: capitalize;
}
.checklists table.info td:nth-child(7) {
    width: 115px;
}
.checklists table.info td:nth-child(8),
.checklists table.info td:nth-child(9) {
    width: 55px;
}
.checklists table.info td.with-ico {
    width: 71px;
}
.checklists table.info td:last-child {
    border-right: 0;
}

.duplicate-ico {
    display: inline-block;
    width: 14px;
    height: 17px;
    background-position: -153px -487px;
}
.checklists table.info tr:hover .duplicate-ico {
    background-position: -170px -487px;
}
.checklists table.info tr:hover .duplicate-ico:hover {
    background-position: -187px -487px;
}

/* NEW CHECKLIST START */

.add-checklist .input-wrap {
    padding: 5px 10px;
    color: #444;
}
.add-checklist .input-holder {
    padding: 2px 5px;
}
.add-checklist .input-holder input[type=text] {
    width: 220px;
}
.add-checklist table {
    width: 100%;
    border-collapse: collapse;
    color: #444;
    font-size: 12px;
}
.add-checklist thead {
    padding: 10px;
    background:#777;
    color: #fff;
}

.add-checklist table td {
    padding: 5px 10px;
    border:1px solid #666;
}
.add-checklist table td:first-child {
    width: 250px;
    border-left: 0;
}
.add-checklist table td:last-child {
    border-right: 0;
}
.add-checklist ul {
    display: flex;
}
.add-checklist ul li {
    display: flex;
    margin-right: 10px;
}
.add-checklist
.circle-yes i,
.circle-no i,
.circle-warn i,
.circle-applicable i {
    display: inline-block;
}
.checklist-items {
    height: 288px;
}
.checklist-items .scrollbar {
    opacity: 1;
    right: 0;
    z-index: 10000;
}
.text-img span,
.clock-img span {
    margin-left: 6px;
    margin-top: 3px;
}
.text-img i {
    width: 19px;
    height: 18px;
    background-position: -29px -486px;
}
.clock-img i {
    width: 16px;
    height: 16px;
    background-position: -133px -488px;
}
label.circle-yes,
label.circle-no,
label.circle-warn,
label.circle-applicable {
    display: inline-flex;
    margin-right: 10px;
    margin-top: 1px;
}
label.circle-applicable {
    margin-left: 0;
}
.circle-yes span,
.circle-no span,
.circle-warn span,
.circle-applicable span {
    margin-left: 6px;
    margin-top: 1px;
}
.circle-yes i,
.circle-no i,
.circle-warn i,
.circle-applicable i {
    width: 14px;
    height: 14px;
}
.circle-yes i {
    background-position: -154px -466px;
}
.circle-no i {
    background-position: -137px -466px;
}
.circle-applicable i {
    background-position: -172px -466px;
}
.circle-warn i {
    background-position: -189px -466px;
}
.ui-selectmenu-menu ul li.daily-checks {
    width: 698px;
    padding: 5px 0 5px 30px;
}
.add-btn {
    position: absolute;
    right: 10px;
    top: 2px;
    cursor: pointer;
}
.add-btn i {
    display: inline-block;
    width: 18px;
    height: 18px;
    background-position: -88px -486px;
}
.add-btn i:hover {
    background-position: -111px -486px;
}
table.default-data tbody tr:last-child td {
    border-bottom: 0;
}
.add-checklist table.info tr{
    background-color: #fff;
    -moz-user-select: none;
    -khtml-user-select: none;
    user-select: none;
}
.add-checklist table.info tr:first-child td {
    border-top: 0;
}
.add-checklist td.select-elem{
    padding: 0;
}
.add-checklist .ui-selectmenu-button {
    width: 96% !important;
    background: transparent;
    border: 0;
    padding-left: 10px;
}
/*.add-checklist .slidee {*/
/*border-bottom: 1px solid #666;*/
/*}*/
.add-checklist .btn-holder,
.vehiclelist .btn-holder {
    padding: 10px;
    overflow: hidden;
}
.vehiclelist .table-drop .btn-holder {
    padding: 0;
    border: 0;
}
.add-checklist .btn-holder .button.generate,
.vehiclelist .btn-holder .button.generate {
    float: right;
    margin-left: 10px;
}
i.drag-checklist {
    margin-right: 8px;
    width: 9px;
    height: 18px;
    background-position: -54px -485px;
    cursor: move;
}
i.drag-checklist:hover {
    background-position: -74px -485px;
}
.remove-checklist {
    display: none;
    height: 18px;
}
.remove-checklist i {
    display: inline-block;
    width: 15px;
    height: 17px;
    margin-left: 5px;
    background-position: -172px -321px;
}
.remove-checklist:hover i {
    background-position: -172px -357px;
}
.first-option,
.second-option,
.third-option {
    width: 698px;
    height: 14px;
    display: inline-block;
    vertical-align: middle;
}

.ui-selectmenu-text.first-option,
.ui-selectmenu-text.second-option,
.ui-selectmenu-text.third-option {
    max-width: 800px;
}
.first-option {
    background: url('/img/html/tracking.europeanvehicletracking.com/response_1.png') 0 0 no-repeat;
}
.second-option {
    background: url('/img/html/tracking.europeanvehicletracking.com/response_2.png') 0 0 no-repeat;
    height: 14px;
}
.third-option {
    background: url('/img/html/tracking.europeanvehicletracking.com/response_3.png') 0 0 no-repeat;
}
.ui-selectmenu-menu .first-option,
.ui-selectmenu-menu .second-option,
.ui-selectmenu-menu .third-option {
    padding: 5px 0 5px 30px;
    max-width: 698px;
    background-position: 30px 5px;
    display: block;
}
.sortable-table thead {
    padding: 0;
    margin: 0;
}
table.info.sortable-table tr:hover {
    background: transparent !important;
}
table.info.sortable-table tr:hover td {
    color: #333;
}
.sortable-table thead td {
    height: 0 !important;
    padding: 0;
    border: 0;
}
.sortable-table thead td:first-child {
    width: 270px;
}
.sortable-table input {
    width: 215px;
    font-size: 12px;
}
.sortable-table input:focus {
    border: 1px solid #03a4e4;
}
/* Draggable table elements start */
body.dragging, body.dragging *{
    cursor: move !important;
}
.sortable-table {
    position: relative;
}
.dragged {
    position: absolute;
    top: 0;
    opacity: .5;
    z-index: 2000;

}

.tr-placeholder {
    height:2px;
    background-color: blue;
    /*width: 100%;*/
}
/* Draggable table elements end */


/* NEW CHECKLIST END */

/* incidents start */
.left-panel .incidents .control-panel > ul { /*ul reset*/
    margin: 0;
    padding: 0;
    list-style: none;
}

.left-panel .incidents .search .input-holder .button {
    line-height: normal;
}

.left-panel .incidents .scroll-frame {
    max-height: 510px;
    overflow: hidden;
}

.left-panel .right-col .menu tr,
.left-panel .incidents .menu tr,
.incident-details .menu tr {
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
}

.left-panel .incidents .control-holder,
.incident-details .control-holder {
    background-color: #03a4e4;
}

.user-menu .categories .incidents .tooltip {
    /*padding: 11px 9px 13px 10px;*/
}

.user-menu .categories .incidents i {
    width: 20px;
    height: 17px;
    background-position: -176px -363px;
}

.user-menu .categories .incidents.active i,
.user-menu .categories .incidents:hover i {
    background-position: -176px -344px;
}

.left-panel .incidents {
    max-height: 513px;
    overflow: hidden;
    width: 1293px;
    display: none;
    -webkit-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.3);
}

.left-panel .incidents .control-panel > ul > li {
    float: left;
    padding-right: 15px;
}

.left-panel .incidents .control-holder .line {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 32px;
    background: #2e4f77;
    border-bottom: 1px #30527c solid;
}

.left-panel .incidents .scrollbar,
.vehicle-search-popup .scrollbar,
.search-variants-holder .scrollbar {
    position: absolute;
    right: 0;
    top: 0;
    opacity: 0.5;
    height: 100%;
    width: 10px;
    z-index: 1;
}

.left-panel .incidents .search .input-holder:last-child {
    background: #fff;
    border: 1px solid #02729f;
    margin-right: 71px;
    width: 202px;
}

.left-panel .incidents .search .input-holder:first-child {
    margin: 0;
}

.left-panel .incidents .search .input-holder input[type="submit"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.left-panel .incidents .range:first-child {
    padding-right: 14px;
}

.left-panel .incidents .range,
.left-panel .incidents .range span {
    float: left;
    overflow: hidden;
}

.left-panel .incidents .date {
    padding-left: 13px;
}

.left-panel .incidents .range span {
    line-height: 23px;
    color: #fff;
}

.left-panel .incidents .range .calendar-btn {
    position: absolute;
    top: 0;
    right: 0;
    padding: 4px 6px 4px 4px;
}

.left-panel .incidents .range input {
    width: 104px;
    padding: 5px 33px 5px 9px;
    height: 10px;
}

.left-panel .incidents .range .input-holder {
    webkit-box-shadow: inset 0px 0px 2px 0px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: inset 0px 0px 2px 0px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0px 0px 2px 0px rgba(0, 0, 0, 0.1);
    border: 1px solid #02729f;
    background: #fff;
    overflow: hidden;
}

.left-panel .incidents .range .calendar-btn i {
    display: block;
    width: 13px;
    height: 13px;
    background-position: -70px -308px;
}

.left-panel .incidents .range .date .calendar-btn.active i {
    background-position: -85px -308px;
}

.left-panel .incidents .button.submit {
    float: right;
    margin-left: 5px;
}

.left-panel .incidents .range .calendar-btn:hover i {
    background-position: -70px -322px;
}

.left-panel .incidents .range .date {
    position: relative;
    overflow: hidden;
    float: left;
}

.left-panel .incidents .search input[type="text"] {
    padding: 3px 0px 3px 0;
}

.left-panel .incidents .search ::-webkit-input-placeholder {
    font-size: 12px;
}

.left-panel .incidents .search ::-moz-placeholder {
    font-size: 12px;
}

.left-panel .incidents .search :-ms-input-placeholder {
    font-size: 12px;
}

.left-panel .incidents .search input:-moz-placeholder {
    font-size: 12px;
}

.left-panel .incidents table.menu {
    width: auto;
    position: relative;
    z-index: 2;
}

.left-panel .incidents .control-panel .button span,
.incident-details .header-panel .btn-holder .button span {
    color: #fff;
}

.left-panel .incidents .control-panel .button,
.incident-details .header-panel .btn-holder .button {
    background: #30527c 0 -137px;
}

.left-panel .incidents .control-panel .button {
    padding: 4px 13px;
}

.left-panel .incidents .control-panel {
    padding: 2px 0 2px 4px;
    overflow: hidden;
}

.left-panel .incidents table.info.content {
    border-top: none;
    margin-left: 1px;
}

.left-panel .incidents table.info.content td:nth-child(3) {
    width: 114px;
}

.left-panel .incidents table.info th:nth-child(3) {
    width: 111px;
}

.left-panel .incidents table.info {
    border-collapse: separate;
    border-spacing: 0;
}

.left-panel .incidents table.info th {
    cursor: pointer;
    padding-left: 0;
    white-space: nowrap;
}

.left-panel .incidents table th > i {
    cursor: e-resize;
    position: absolute;
    top: 0;
    right: -5px;
    width: 10px;
    height: 100%;
    z-index: 1;
}

.left-panel .incidents table.info th > span {
    padding-left: 11px;
}

.left-panel .incidents table.info th:first-child {
    border-left: none;
}

.left-panel .incidents table.info td {
    padding: 3px 0 3px 0;
}

.left-panel .incidents table.info td > span {
    padding-left: 11px;
}

.left-panel .incidents table.info td .button {
    display: inline-block;
}

.left-panel .incidents table.info td:last-child {
    text-align: center;
}

.left-panel .incidents .ui-selectmenu-text,
.geo-monitor .header-panel .ui-selectmenu-text {
    color: #242424;
    margin-left: 4px;
    text-overflow: initial;
}

.left-panel .incidents .ui-selectmenu-button,
.geo-monitor .header-panel .ui-selectmenu-button {
    border: 1px solid rgba(0,0,0,0.3);
    padding: 3px 7px 3px 4px;
    background: #fff 0 -137px;
    max-width: 98px !important;
    min-width: 98px !important;
}

.left-panel .incidents .ui-selectmenu-button .ui-icon,
.geo-monitor .header-panel .ui-selectmenu-button .ui-icon {
    background-position: -162px -307px;
    height: 10px;
    width: 12px;
    margin-top: 3px;
}

.left-panel .incidents .ui-selectmenu-menu li,
.geo-monitor .header-panel .ui-selectmenu-menu li {
    background: #fff;
    border-bottom: 1px solid #ddd;
    color: #242424;
    padding: 5px 0 4px 9px;
}

.left-panel .incidents .ui-selectmenu-menu li:last-child,
.geo-monitor .header-panel .ui-selectmenu-menu li:last-child {
    border: none;
}

.left-panel .incidents .ui-selectmenu-menu li:hover,
.geo-monitor .header-panel .ui-selectmenu-menu li:hover {
    background: #42bbeb;
    color: #fff;
}

.left-panel .incidents .control-panel .button:hover,
.left-panel .incidents .control-panel .ui-selectmenu-button:hover,
.geo-monitor .header-panel .ui-selectmenu-button:hover {
    -webkit-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.3);
}

.left-panel .incidents .control-panel .button:active,
.left-panel .incidents .control-panel .ui-selectmenu-button:active,
.geo-monitor .header-panel .ui-selectmenu-button:active {
    background-position: 0 -159px;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

/* incidents end */

/* VEHICLELIST START */
.assign-btn i {
    display: inline-block;
    vertical-align: middle;
    width: 3px;
    height: 14px;
    margin-left: 28px;
    background-position: -298px -400px;
}

.assign-checklist {
    display: none;
    background-color: #fff;
    z-index: 1;
    position: absolute;
    width: 149px;
    max-height: 300px;
    box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.3);
}

.assign-checklist ul li {
    padding: 3px 4px 5px 4px;
    cursor: pointer;
}

.assign-checklist ul li:hover {
    background-color: #f3f3f3;
}

.vehiclelist .header-panel .button,
.checklists .header-panel .button {
    float: right;
    margin-left: 10px;
}
.vehiclelist table.info tbody tr {
    cursor: default;
}
.vehiclelist table.info th.with-checkbox {
    padding-left: 12px;
}
.vehiclelist table.info th:nth-child(1){
    width: 27px;
}
.vehiclelist table.info th:nth-child(2),
.vehiclelist table.info th:nth-child(3),
.vehiclelist table.info th:nth-child(7) {
    width: 128px;
}
.vehiclelist table.info th:nth-child(4),
.vehiclelist table.info th:nth-child(5),
.vehiclelist table.info th:nth-child(6) {
    width: 110px;
}
.vehiclelist table.info th:nth-child(8) {
    width: 162px;
}
.vehiclelist table.info td:nth-child(1){
    width: 24px;
}
.vehiclelist table.info td:nth-child(2),
.vehiclelist table.info td:nth-child(3),
.vehiclelist table.info td:nth-child(7) {
    width: 123px;
}
.vehiclelist table.info td:nth-child(4),
.vehiclelist table.info td:nth-child(5),
.vehiclelist table.info td:nth-child(6) {
    width: 105px;
}
.vehiclelist table.info td:nth-child(8) {
    width: 157px;
}
.vehiclelist table.info td.with-checkbox {
    width: 40px;
}
.warning-assign {
    padding: 10px 7px 20px;
    font-style: italic;
}
/* VEHICLELIST END */

.info-holder.flexible>table.info{
    table-layout: auto;
}
.info-holder.flexible table.info th,
.info-holder.flexible table.info td{
    padding: 0;
    white-space: normal;
    text-overflow: clip;
}
.info-holder.flexible table.info th > div{
    padding: 8px 0 8px 11px;
}
.info-holder.flexible table.info td > div{
    padding: 7px 5px 8px 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}