@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600,300,700&subset=latin,greek,greek-ext,cyrillic,cyrillic-ext,latin-ext,vietnamese);
html, body { height: 100%; margin: 0px; padding: 0px; font-size: 11px; font-family: "open sans"; color: #444444; overflow: hidden; }
a,
a:hover { text-decoration: none; color: #3970ca; }
.ui-menu { position: absolute; width: 170px; z-index: 99999; }
.dot-sep {
    width: 11.5px;
    text-align: center;
    float: left;
    padding: 5px 0;
}

/*#################################################*/
/* INPUTBOXES, SELECT
/*#################################################*/

input.checkbox { vertical-align: middle; }
.inputbox { width: 100%; padding: 0 5px;}
textarea.inputbox { padding: 5px; }
input, textarea {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
input.color,
input.color:focus,
input.color:hover { border: none; }
input,
select,
.inputbox,
.textarea{
    margin: 0;
    height: 24px;
    border: 1px solid #dddddd;
    color: #7a7a7a;
    background: #fbfbfb;
    font-family: "open sans";
    font-size: 11px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;

}
input:focus { background-color: #ffffff; color: #444444; }
select { height: 24px; }
.inputbox:hover,
.textarea:hover,
select:hover { border: 1px solid #bbbbbb; }
.inputbox:disabled,
.textarea:disabled,
select:disabled { border: 1px solid #d3d3d3; background: #eeeeee; }
.inputbox_calendar {
    color: #7a7a7a;
    border: 1px solid #d3d3d3;
    -webkit-inline-box: none;
    background: url("../img/ico/inputbox_calendar.png") right no-repeat;
}
.inputbox_calendar:disabled { -webkit-inline-box: none; background: #eeeeee url("../img/ico/inputbox_calendar.png") right no-repeat; }
.inputbox_search {
    width: 255px;
    height: 28px;
    text-indent: 30px;
    background: #f5f5f5 url("../img/ico/inputbox_search.png") 10px center no-repeat;
    float: left;
}

/*#################################################*/
/* BUTTONS
/*#################################################*/

*:focus { outline: 0; }
.report-controls { margin: 5px 0; }
.button.add-new {
    background-image:url(images/ico/plus.png);
    background-position: 10px center;
    background-repeat: no-repeat;
}
.panel_buttons,
.panel_button { float: left; }
.panel_button img {
    display: block;
    padding: 5px;
    background: #f5f5f5;
    border: 1px solid #dddddd;
    margin-left: 3px;
}
.panel_button img.reload-btn { margin-left: 0; }
input.button {
    border: 1px solid #dddddd;
    background-color: #fbfbfb;
    height: 24px;
    min-width: 78px;
    color: #555555;
    cursor: pointer;
    text-align: center;
    margin-bottom: 3px;
}
input.button.icon {
    text-align: left;
    padding-left: 25px;
    margin-bottom: 0;
    background-repeat: no-repeat;
    background-position: 10px center;
}
input.button:hover { background-color: #e7e6e6; color: #212121; }
input.button:active { background-color: #eeeeee; color: #555555; }
input.button:disabled { background-color: #eeeeee; color: #555555; }
input.button.icon-key {
    background-image: url(images/ico/key-white.png);
    background-color: #9cc602;
    border-color: #8bb001;
    color: #ffffff;
}
input.button.icon-key:hover { background-color: #8bb100; }
input.button.icon-reports {
    background-image: url(images/ico/reports.png);
    background-color: #5d5d5d;
    border-color: #5d5d5d;
    color: #ffffff;
}
input.button.icon-reports:hover { background-color: #444444; }
input.button.show-import-export { 
    min-width: 25px;
    float: right;
    background: #9cc602 url(images/ico/import-export.png) center center no-repeat; 
    border-color: #8bb001;
    padding: 0;
    margin: 0;
}
input.button.show-import-export:hover { background-color: #8bb100; }

/*#################################################*/
/* DIMENSIONS
/*#################################################*/

.width2 { width: 2%;}
.width15 { width: 15%; float: left; }
.width20 { width: 20%; }
.width21 { width: 21%;}
.width25 { width: 25% }
.column27 { width: 27%; }
.width30 { width: 30%; }
.width33 { width: 33.33333% }
.width40 { width: 40%; }
.width45 { width: 45%; }
.width50 { width: 50%; }
.width60 { width: 60%; }
.width65 { width: 65%; }
.width70 { width: 70%; }
.width75 { width: 75%; }
.width10 { width: 10%; }


.width100 { width: 100%; }
.width-900 { max-width: 900px; }
.column15 { width: 15%; float: left; }
.column20 { width: 20%; }
.column25 { width: 25%; }
.column30 { width: 30%; }
.column35 { width: 35%; }
.column40 { width: 40%; }
.column50 { width: 50%; }
.column60 { width: 60%; }
.column65 { width: 65%; }
.column70 { width: 70%; }
.column73 { width: 73%; }
.column80 { width: 80%; }
.column85 { width: 85%; }


/*#################################################*/
/* FLOATING AND SPACING
/*#################################################*/

.float-left,
.block { float: left; }
.float-right { float: right; }
.container { margin-right: 10px; }
.container.last,
.last .title-block,
.container.last fieldset { margin-right: 0; }
.absolute-right { position: absolute; right: 10px; top: 36px; margin: 0; }
.absolute-right-scroll  { position: absolute; right: 20px; top: 36px; margin: 0; } 

/*#################################################*/
/* TABLELESS STYLING
/*#################################################*/

.row { margin-bottom: 10px; display: table; width: 100%; line-height: 12px; font-size: 0; }
.row div { display: inline-block; vertical-align: middle; font-size: 11px; } /* display: table-cell; */
.row2 { margin-bottom: 3px; display: table; width: 100%; text-align: left; line-height: 12px; font-size: 0; }
.row2 div { display: inline-block; vertical-align: middle; font-size: 11px;} /* display: table-cell; */
.row2.empty { height: 24px; }
.row3 { margin-bottom: 10px; display: table; width: 100%; } /* FIX if something goes wrong with css. This row doesn't have vertical alignment, suitable just to split lines and add spacing at the bottom */
.title-block {
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #dddddd;
    font-weight: bold;
    font-size: 12px;
    color: #3970ca;
}

/*#################################################*/
/* FIX
/*#################################################*/

.clearfix { display: table; width: 100%; height: 100%; }
#login ::-webkit-input-placeholder { color: #ececec; }
#login :-moz-placeholder { /* Firefox 18- */ color: #ececec; }
#login ::-moz-placeholder {  /* Firefox 19+ */ color: #ececec; }
#login :-ms-input-placeholder { color: #ececec; }

/*#################################################*/
/* LOGIN PAGE
/*#################################################*/

#login { background: #f8f8f8; }
.line { border-top: 3px solid #3970ca; }
.login-block {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -250px 0 0 -212px;
    width: 425px;
}
#login #logo { margin-bottom: 50px; }
#login #tabs_connect { margin-bottom: 10px; }
#login .tab-content {
    background: #3970ca;
    color: #ffffff;
    padding: 15px;
}
#login .title-block {
    color: #ffffff;
    border: none;
    font-size: 13px;
    font-weight: 100;
    display: table-cell;
    height: 50px;
    vertical-align: middle;
}
#login .ui-tabs .ui-tabs-nav { background-color: #ffffff; border: none; }
#login .ui-tabs .ui-tabs-nav li.ui-tabs-active a {
    background: #3970ca;
    color: #ffffff;
    padding: 8px 15px;
}
#login .ui-tabs .ui-tabs-nav li a {
    padding: 8px 15px;
    font-size: 13px;
    font-weight: 100;
}
#login .ui-tabs .ui-tabs-nav li.ui-tabs-active { border: none; }
#login .ui-tabs .ui-tabs-nav { padding: 0; }
#login input.inputbox {
    height: 35px;
    background-color: #5A8AD7;
    border: none;
    color: #ffffff;
    font-size: 12px;
    width: 360px;
}
#login input.button.mobile-v { border: none; padding: 0; }
#login input.button.mobile-v:hover { color: #3970ca; background: none; }
#login .icon {
    float: left;
    width: 35px;
    height: 35px;
    background-color: #85AAE5;
    background-position: center center;
    background-repeat: no-repeat;
}
.icon.icon-user { background-image: url(images/ico/login-user.png); }
.icon.icon-email { background-image: url(images/ico/login-email.png); }
.icon.icon-password { background-image: url(images/ico/login-pass.png); }
.icon.icon-code { background-image: url(images/ico/login-shield.png); }

#login .tab-content input.button {
    background: #ffffff;
    border: none;
    padding: 5px;
    margin-top: 15px;
    height: auto;
    min-width: 90px;
}
#login .tab-content input.button:hover { background: #f5f5f5; color: #3970ca; }
.reveal {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 20px;
    height: 20px;
    background: url(images/ico/eye2.png) center center no-repeat;
    cursor: pointer;
}
.reveal.hide { background: url(images/ico/eye2-crossed.png) center center no-repeat; }
.security-code {
    position: absolute;
    top: 10px;
    right: 10px;
}
#login .remember-block {
    position: absolute;
    right: 0;
    bottom: -25px;
    line-height: 14px;
}
.remember-block input { height: 15px; margin-right: 5px; }

/*#################################################*/
/* TOP PANEL STYLE
/*#################################################*/

#top_panel {
    height: 36px;
    background: #f8f8f8;
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid #e7e7e7;
}
#top_panel select { margin: 1px 0; }
#top_panel .right-menu { float: right; }
#top_panel ul { margin: 0; padding: 0; float: left; display: table; }
#top_panel ul li a { 
    display: table; 
    padding: 8px 15px; 
    text-decoration: none; 
    color: #808080;
    font-size: 13px;
}
#top_panel ul li {
    list-style: none;
    display: table;
    float: left;
    border-right: 1px solid #f2f2f2;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
#top_panel ul li:last-child { border-right: none; }
#top_panel ul li.select_map:hover,
#top_panel ul li.select_language:hover { background: none; }
#top_panel ul li:hover { background: #ffffff; }
#top_panel .select_map { border: none; }
#top_panel .select_map,
#top_panel .select_language { padding: 5px 5px; }
#top_panel .logo_btn { background: #3970CA; }
#top_panel .logo_btn a { padding: 7px 14px; } 
#top_panel .logo_btn:hover { background: #5581c9; }
#top_panel .cpanel_btn { background: #fab444; border: none; }
#top_panel .cpanel_btn:hover { background: #ffc15f; }
#top_panel img { display: block;}
#top_panel .logout_btn { background: #6c6c6c; }
#top_panel .logout_btn:hover { background: #8e8e8e; }
#top_panel .user_btn img { float:left; margin-right: 5px;}
#top_panel .select_language.cp { border: none; }
#top_panel ul li a.active {background-color: #ffffff;}

@media (max-width: 1130px) {
    #top_panel .select_language {
        display: none;
    }
}

@media (max-width: 1010px) {
    #top_panel .user_btn {
        display: none;
    }
}

/*#################################################*/
/* TOP PANEL STYLE IN CPANEL
/*#################################################*/

#top_panel .select-view,
#top_panel .select-language { padding: 5px 10px; }
#top_panel li.select-view:hover,
#top_panel li.select-language:hover { background: none; }
#top_panel .back-btn { background: #3970ca; }
#top_panel .back-btn:hover { background: #5581c9; }
#top_panel .user-btn img,
#top_panel .user-list-btn img,
#top_panel .manage-server-btn img,
#top_panel .object-list-btn img { float: left; margin-right: 5px; }
#top_panel .unused-object-list-btn img { float: left; margin-right: 5px; }
#top_panel .delay-object-list-btn img { float: left; margin-right: 5px; }

@media (max-width: 1107px) {
    #top_panel .select-language {
        display: none;
    }
}

@media (max-width: 988px) {
    #top_panel .user-btn {
        display: none;
    }
}

/*#################################################*/
/* LEFT PANEL DIVS AND CLASSES
/*#################################################*/
#left_panel {
    /*width: 344px;*/
     width: 354px;
    bottom: 0;
    top: 0;
    position: relative;
}

#left_panel .panel_buttons { margin-left: 10px; }
#left_panel_places { padding-left: 0px; padding-right: 0px;}
#left_panel_places .inputbox_search { width: 162px; }
#left_panel_places_marker_list_grid input.checkbox { height: auto; }
#left_panel_places_zone_list_grid input.checkbox { height: auto; }
#left_panel_places_route_list_grid input.checkbox { height: auto; }

#left_panel_places .ui-tabs-nav
{
    border: 0px;
    margin-left: 10px;
    margin-right: 10px;
    padding: 2px;
}

#left_panel_places .ui-tabs-nav li
{
    border: 0px;
}

#left_panel_places .ui-tabs-nav li a
{
    padding: 3px 8px;
}

#left_panel_places .ui-tabs-nav li.ui-tabs-active a
{
    padding: 3px 8px;
}

.ui-menu { position: absolute; width: 185px; z-index: 99999999; }

#left_panel_objects_menu {
    background: #ffffff;
    -webkit-box-shadow: 0 0 15px 0 #9b9b9b;
    box-shadow: 0 0 15px 0 #9b9b9b;
}
#left_panel_objects_menu ul {
    background: #ffffff;
    -webkit-box-shadow: 3px 0 5px 0 #9b9b9b;
    box-shadow: 3px 0 5px 0 #9b9b9b;
}
#left_panel_objects_menu .ui-menu-icon { background: url(images/ico/arrow.png) left center no-repeat; }
#left_panel_objects_menu ul li a { background: url(images/ico/arrow.png) 10px center no-repeat; }
#left_panel_objects_menu li { border-top: 1px solid #f5f5f5; }
#left_panel_objects_menu li a {
    background-repeat: no-repeat;
    background-position: 10px center;
    padding: 5px 15px 5px 28px;
    color: #444444;
}
#left_panel_objects_menu li a:hover { background-color: #f5f5f5; }
#left_panel_objects_menu li:first-child { border: none; }
#left_panel_objects_menu .first-item { border-top: 3px solid #3970ca; }

#places_marker_icon_tabs {
    margin-left: -15px;
    margin-right: -15px;
    width: 324px;
}

#places_marker_icon_default_tab, #places_marker_icon_custom_tab {
    padding-bottom: 0px;
}

#places_marker_icon_default_list {
    position: relative;
    height: 245px;
    overflow-y: scroll;
    border: 1px solid #dddddd;
    padding: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#places_marker_icon_custom_list {
    position: relative;
    height: 208px;
    overflow-y: scroll;
    border: 1px solid #dddddd;
    padding: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


#dialog_places_marker_icon_list {
    position: relative;
    height: 192px;
    overflow-y: scroll;
    border: 1px solid #dddddd;
    padding: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.loader-img {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -10px 0 0 -110px;
}

/*#################################################*/
/* BOTTOM PANEL DIVS AND CLASSES */
/*#################################################*/

#bottom_panel {
    display: none;
    position: absolute;
    bottom: 0px;
    left: 349px;
    right: -1px;
    background-color: #ffffff;
}

#bottom_panel_graph_data_control {
    float: left;
    margin-left: 15px;
}
#bottom_panel_graph,
#bottom_panel_per_travel,
#bottom_panel_msg  { background: #ffffff; }
#bottom_panel_graph_label {
    float: right;
    margin-top: 3px;
}
#bottom_panel_graph_view_control { margin-top: 4px; }
#bottom_panel_graph_plot {
    top:30px;
    height: 100%;
    width:100%;
}
.control-buttons { height: 18px; margin: 2px 15px; }
.control-buttons a {
    display: inline-block;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.control-buttons a:hover { opacity: 0.6; }
.graph-view-control.control-buttons { margin-right: 0; }

/*#################################################*/
/* DRAGBARS
/*#################################################*/

#left_panel_objects_dragbar,
#left_panel_events_dragbar,
#left_panel_history_reports_dragbar {
    margin: 3px -11px;
    height:5px;
    background: #F6F6F6;
    cursor: row-resize;
}
#left_panel_objects_dragbar:hover,
#left_panel_events_dragbar:hover,
#left_panel_history_reports_dragbar:hover { background-color: #dddddd; }

/*#################################################*/
/* HIDE PANELS
/*#################################################*/

#hide_left_panel {
    position: absolute;
    top: 37px;
    bottom: 0px;
    /*left: 344px;*/
    left: 354px;
    width: 4px;
    background: #f5f5f5;
    border-right: 1px solid #e7e7e7;
}
#hide_left_panel:hover { background-color: #dddddd; border-right: 1px solid #dddddd;}
#hide_bottom_panel {
    position: absolute;
    bottom: 0px;
    /*left: 348px;*/
     left: 358px;
    right: 0px;
    height: 5px;
    background: #f5f5f5;
    border-top: 1px solid #e7e7e7;
    border-left: 1px solid #e7e7e7;
}
#hide_bottom_panel:hover { background-color: #dddddd; }

/*#################################################*/
/* SETTINGS
/*#################################################*/

#dialog_settings,
#dialog_settings_object_edit,
#settings_object_sensors,
#settings_object_service,
#settings_main_objects_groups_drivers { padding: 0px; }
#settings_main { height: auto; margin-top: 0px; border-top: 0px; }
#settings_object { height: 470px; border-top: 0px; }
#settings_object_sensor_calibration_list {
    margin-top: 1px;
    margin-bottom: 1px;
    border: 1px solid #dddddd;
}
#dialog_settings .info { height: 50px; display: table-cell; vertical-align: middle; }
#settings_main_objects,
#settings_main_subaccounts { padding: 0 10px 10px 10px; }
#settings_object_sensors_list,
#settings_object_service_list { padding: 10px; }
#dialog_device_icon_list,
#dialog_settings_object_edit_select_icon_list {
    position: relative;
    height: 155px;
    overflow-y: scroll;
    border: 1px solid #dddddd;
    padding: 5px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/*#################################################*/
/* CPANEL
/*#################################################*/

#cpanel h1.title {
    margin: 0;
    color: #3970ca;
    display: table;
    float: left;
}
.version { font-size: 10px; font-weight: bold; color: #808080; }
#cpanel .ui-jqgrid .ui-jqgrid-titlebar,
#cpanel_manage_server .cpanel-title { margin-bottom: 12px; }
#cpanel h1.title span { color: #808080; font-weight: 300; }
body#cpanel { background: #f1f1f1; }
#cpanel_user_list,
#cpanel_object_list,
#cpanel_unused_object_list,
#cpanel_delay_object_list,
#cpanel_manage_server {
    margin: 15px;
    padding: 15px;
    background: #ffffff;
    border-top: 3px solid #3970ca;
    -webkit-box-shadow: 0 0 15px 0 #c6c6c6;
    box-shadow: 0 0 15px 0 #c6c6c6;
}

#dialog_user_edit { padding: 0px; }
#cpanel #cpanel_user_list .ui-jqgrid .ui-jqgrid-hdiv,
#cpanel #cpanel_object_list .ui-jqgrid .ui-jqgrid-hdiv,
#cpanel #cpanel_unused_object_list .ui-jqgrid .ui-jqgrid-hdiv,
#cpanel #cpanel_delay_object_list .ui-jqgrid .ui-jqgrid-hdiv
{ padding: 4px 0; margin-bottom: 3px; }
#cpanel #cpanel_user_list .ui-jqgrid tr.jqgrow td,
#cpanel #cpanel_object_list .ui-jqgrid tr.jqgrow td,
#cpanel #cpanel_unused_object_list .ui-jqgrid tr.jqgrow td,
#cpanel #cpanel_delay_object_list .ui-jqgrid tr.jqgrow td
{ padding: 3px; }
#cpanel #dialog_user_edit .ui-jqgrid .ui-jqgrid-hdiv { padding: 2px 0; }
#cpanel .inputbox_search { width: 300px; height: 28px; font-size: 14px; float: right; margin-left: 3px; }
#cpanel #top_panel {
    -webkit-box-shadow: 0 0 15px 0 #c6c6c6;
    box-shadow: 0 0 15px 0 #c6c6c6;
}
#cpanel .ms-save {
    position: absolute;
    right: 15px;
    top: 12px;
}
#cpanel #dialog_user_edit_account .controls {
    position: absolute;
    right: 15px;
    top: 3px;
}
#cpanel #cpanel_manage_server .ui-tabs-nav {
    background: #f5f5f5;
    padding: 10px 15px;
    border-bottom: none;
    margin: 0 -15px;
}
#cpanel #cpanel_manage_server .ui-tabs .ui-tabs-nav li.ui-tabs-active a {
    background-color: #444444;
    color: #ffffff;
    padding: 5px 15px;
}
#cpanel #cpanel_manage_server .ui-tabs .ui-tabs-nav li a {
    padding: 5px 15px;
    background: #ffffff;
    margin-right: 5px;
    color: #808080;
    font-size: 12px;
}
#cpanel #cpanel_manage_server .ui-tabs .ui-tabs-nav li { border: none; }
.cp-server a {
    background-image: url(images/ico/close.png);
    background-repeat: no-repeat;
    background-position: 10px center;
}
#cpanel_manage_server {
    position: absolute;
    top: 37px;
    bottom: 0px;
    right: 0px;
    left: 0px;
    overflow: hidden;
}
.cpanel_tabs_content {
    position: absolute;
    top: 50px;
    bottom: 58px;
    right: 0px;
    left: 0px;
    overflow-y: auto;
}


/*#################################################*/
/* MAP
/*#################################################*/

#map {
    position: absolute;
    top: 37px;
    /*left: 349px;*/
    left: 359px;
    right: 0px;
    bottom: 5px;
}
.mapPopup{
    display: block;
    white-space: nowrap;
    margin: -2px;
    padding-left: 5px;
    padding-top: 1px;
    padding-bottom: 1px;
    padding-right: 5px;
    border-width: 1px;
    border-style: solid;
    border-color: #F1D031;
    background-color: #FFFFA3;
    color: #555;
    opacity: 0.8;
    -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.2);
}


.history-control
{
    display: none;
    position: absolute;
    top: 47px;
    left: 440px;
    background-color: #ffffff;
    padding: 2px 5px 1px 5px;
    font-size: 12px;
    color: #808080;
    border-radius: 2px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.65);
}

/*#################################################*/
/* OTHER
/*#################################################*/

#loading_panel {
    background-color:#FFFFFF;
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index:99999;
}
#blocking_panel {
    background-color: rgba(170, 170, 170, 0.3);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: none;
    z-index: 99999;
}
#blocking_panel_msg { background-color: #FFFFFF; padding: 20px; }

#loading_data_panel {
    background-color: #FFFFFF;
    opacity: 0.6;
    filter: Alpha(Opacity=30);
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 99999;
}

/*#################################################*/
/* IMAGE GALLERY
/*#################################################*/

#dialog_image_gallery { padding-bottom: 0; overflow: hidden; }
#image_gallery_img {
    width: 640px;
    height: 480px;
    border: 1px solid #dddddd;
}
#image_gallery_img_data {
    background: #f5f5f5;
    border-top: 1px solid #dddddd;
    height: 27px;
    width: 657px;
    margin-top: 5px;
    margin-right: -15px;
}
#dialog_image_gallery .img-controls { width: 320px; }
#gview_image_gallery_list_grid { border: 1px solid #dddddd; }

#gview_cpanel_manage_server_template_list_grid { border: 1px solid #dddddd; }
.ui-jqgrid #gview_cpanel_manage_server_template_list_grid  .ui-jqgrid-hdiv{ margin-bottom: 0; }

/*#################################################*/
/* INFORMATION AND MESSAGES
/*#################################################*/

.info { margin-bottom: 10px; font-size: 14px; }
.subinfo {color: #949494; line-height: 12px;}

/*#################################################*/
/* DIALOG HEADER ICONS
/*#################################################*/

#ui-id-33 { background: url(images/ico/about.png) left center no-repeat; padding-left: 25px;}
#ui-id-51,
#ui-id-35 { background: url(images/ico/point.png) left center no-repeat; padding-left: 25px;}
#ui-id-36 { background: url(images/ico/search.png) left center no-repeat; padding-left: 25px;}
#ui-id-37 { background: url(images/ico/cmd.png) left center no-repeat; padding-left: 25px;}
#ui-id-38 { background: url(images/ico/gallery.png) left center no-repeat; padding-left: 25px;}
#ui-id-39 { background: url(images/ico/settings.png) left center no-repeat; padding-left: 25px;}
#ui-id-11 ,
#ui-id-41 { background: url(images/ico/edit.png) left center no-repeat; padding-left: 25px;}
#ui-id-42 { background: url(images/ico/duplicate.png) left center no-repeat; padding-left: 25px;}
#ui-id-47 { background: url(images/ico/service.png) left center no-repeat; padding-left: 25px;}
#ui-id-48 { background: url(images/ico/event-prop.png) left center no-repeat; padding-left: 25px;}
#ui-id-49 { background: url(images/ico/subaccounts.png) left center no-repeat; padding-left: 25px;}
#ui-id-52 { background: url(images/ico/report.png) left center no-repeat; padding-left: 25px;}
#ui-id-53 { background: url(images/ico/import-export-big.png) left center no-repeat; padding-left: 25px;}

.ui-state-active #ui-id-33   { background-color: #45555f;color: #ffffff;}
.ui-state-active #ui-id-35   { background-color: #45555f;color: #ffffff;}
.ui-state-active #ui-id-36   { background-color: #45555f;color: #ffffff;}
.ui-state-active #ui-id-37   { background-color: #45555f;color: #ffffff;}
.ui-state-active #ui-id-38   { background-color: #45555f;color: #ffffff;}
.ui-state-active #ui-id-39   { background-color: #45555f;color: #ffffff;}
.ui-state-active #ui-id-41   { background-color: #45555f;color: #ffffff;}
.ui-state-active #ui-id-42   { background-color: #45555f;color: #ffffff;}
.ui-state-active #ui-id-54   { background-color: #45555f;color: #ffffff;}

/*#################################################*/
/* DIALOG CONTROLS AND TABS
/*#################################################*/

.controls-block {
    margin: -15px -15px 10px -15px;
    padding: 5px 15px;
    background: #f5f5f5;
    border-bottom: 1px solid #dddddd;
}


#settings_main_object_list,
#settings_main_object_group_list ,
#settings_main_object_driver_list,
#object_control_tabs #cmd,
#object_control_tabs #cmd_status { padding: 0; margin-top: 10px; }
#object_control_tabs .ui-tabs-nav { margin: 0 -15px; }
#settings_main_objects_groups_drivers .ui-tabs-nav { margin: 0 -10px; }

/*#################################################*/
/* ICONS
/*#################################################*/

.icon-new { background-image: url(images/ico/plus.png); }
.icon-save { background-image: url(images/ico/save-small.png); }
.icon-follow { background-image: url(images/ico/follow.png); }
.icon-create { background-image: url(images/ico/create.png); }
.icon-copy { background-image: url(images/ico/copy.png); }
.icon-show { background-image: url(images/ico/eye.png); }
.icon-hide { background-image: url(images/ico/eye-crossed.png); }
.icon-close { background-image: url(images/ico/close.png); }
.icon-edit { background-image: url(images/ico/pen.png); }
.icon-search { background-image: url(images/ico/search2.png); }
.icon-time { background-image: url(images/ico/time.png); }
.icon-refresh { background-image: url(images/ico/refresh.png); }
.icon-loading { background-image: url(images/ico/loading.gif); }
.icon-emails { background-image: url(images/ico/email.png); }
.icon-visits { background-image: url(images/ico/event-prop.png); }


.icon-arrow-right {
    padding: 5px 15px 5px 28px;
    background: url("images/ico/arrow.png") 10px center no-repeat;
}


.icon-objects { background-image: url(images/objects.png); }
.icon-objects-disabled
{
    background-image: url(images/objects.png);
    box-shadow: inset 0 0 0 15px rgba(255,255,255,.6);
}

.icon-markers { background-image: url(images/markers.png); }
.icon-markers-disabled
{
    background-image: url(images/markers.png);
    box-shadow: inset 0 0 0 15px rgba(255,255,255,.6);
}

.icon-routes { background-image: url(images/routes.png); }
.icon-routes-disabled
{
    background-image: url(images/routes.png);
    box-shadow: inset 0 0 0 15px rgba(255,255,255,.6);
}

.icon-zones { background-image: url(images/zones.png); }
.icon-zones-disabled
{
    background-image: url(images/zones.png);
    box-shadow: inset 0 0 0 15px rgba(255,255,255,.6);
}


.icon-street-view { background-image: url(images/streetView.png); }
.icon-street-view-disabled
{
    background-image: url(images/streetView.png);
    box-shadow: inset 0 0 0 15px rgba(255,255,255,.6);
}


.icon-clusters { background-image: url(images/clusters.png); }
.icon-clusters-disabled
{
    background-image: url(images/clusters.png);
    box-shadow: inset 0 0 0 15px rgba(255,255,255,.6);
}

.icon-traffic { background-image: url(images/traffic.png); }
.icon-traffic-disabled
{
    background-image: url(images/traffic.png);
    box-shadow: inset 0 0 0 15px rgba(255,255,255,.6);
}


/*#################################################*/
/* PAGER CORRECTIONS
/*#################################################*/

#cpanel .ui-pg-div { margin-left: -10px; margin-right: 5px; }
#cpanel #dialog_user_edit .ui-pg-div { margin-left: -5px; margin-right: 0px; }
#cpanel #dialog_user_edit .ui-jqgrid .ui-jqgrid-pager,
#settings_main .ui-jqgrid .ui-jqgrid-pager,
#dialog_settings_object_edit .ui-jqgrid .ui-jqgrid-pager { padding: 2px 10px 0px 10px !important; margin: 3px -10px -10px -10px !important;  }
#dialog_settings .ui-pg-div { margin-left: -5px; }
#cpanel .ui-pg-div .ui-icon-plus,
#dialog_reports .ui-pg-div .ui-icon-plus,
#dialog_settings .ui-pg-div .ui-icon-plus,
#dialog_settings_object_edit .ui-pg-div .ui-icon-plus,
#dialog_reports_new .ui-pg-div .ui-icon-plus {
    background: #3970ca url(images/ico/plus-white.png ) center center no-repeat;
    padding: 6px;
    margin: -4px 5px -5px -5px;
}

#dialog_settings_object_edit .ui-pg-div .ui-icon-plus {
    margin: -4px 0px -5px -10px;
}

#left_panel .ui-jqgrid .ui-jqgrid-pager {
    border-top: none;
    margin: 3px 0 0 -15px !important;
    padding: 2px 15px !important;
    height: auto;
}
#bottom_panel .ui-jqgrid .ui-jqgrid-pager {
    margin: 3px -10px 0 -10px !important;
    padding: 0 10px !important;}
#dialog_image_gallery .ui-jqgrid .ui-jqgrid-pager {
    margin: 10px -15px -15px -15px !important;
    padding: 2px 12px 0px 15px !important;
}

/*#################################################*/
/* FOLLOW
/*#################################################*/

#map_follow {
    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
}

#left_panel_follow {
    display: none;
    position: absolute;
    top: 75px;
    bottom: 0px;
    left: 0px;
    width: 280px;
    background-color: #ffffff;
    opacity: 0.8;
}

@media (min-width: 640px)
{
    #left_panel_follow {
        display: none;
        position: absolute;
        top: 0px;
        bottom: 0px;
        left: 0px;
        width: 280px;
        background-color: #ffffff;
        opacity: 1;
    }
}

.object-follow-control
{
    position: absolute;
    top: 10px;
    right: 10px;
    background-color: #ffffff;
    padding: 2px 5px 1px 5px;
    font-size: 12px;
    color: #808080;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.65);
}

#object_menu_panel {
    display: none;
    width: 38px;
    position: fixed;
    bottom: 0;
    top: 37px;
    left: 344px; 
    border-left: 1px solid #e7e6e6;
    border-right: 1px solid #e7e6e6;
}

#object_menu_panel ul {
    list-style: outside none none;
    border-bottom: 1px solid #e7e6e6;
    margin: 0;
    padding: 0;
}

#object_menu_panel ul li {
    background: none repeat scroll 0 0 #f5f5f5;
    border: 1px solid #e1e1e1;
    height: 25px;
    margin: 6px;
    padding: 0;
    text-align: center;
    width: 25px;
}

#object_menu_panel ul li a {
    display: block;
    text-decoration: none;
    width: 25px;
    height: 25px;
}

#manage_device_sensors,
#manage_device_commands,
#manage_server_events{
    margin: 0 10px;
}

#dialog_reports_events{
    display: none; 
}

.events-block .event-element{
    float: left;
    width: 25%;
}

#stop_drive_block{
    display: none; 
}

#chart_sensor_div {
    border: 1px solid #e7e6e6;
    margin-top: 10px;
    min-height: 50px;
    max-height: 215px;
    width: 318px;
    overflow-x: auto;
}

#chart_sensor_div span {
    float: left;
}

#icon_sensor_div {
    border: 1px solid #e7e6e6;
    min-height: 250px;
    width: 38px; 
}
#icon_sensor_div .icon_container{
    border-bottom: 1px solid #e7e6e6;
    margin: 0;
    padding: 0;
}

#icon_sensor_div .icon_container .icon {
    background: none repeat scroll 0 0 #f5f5f5;
    border: 1px solid #e1e1e1;
    height: 25px;
    margin: 6px;
    padding: 0;
    text-align: center;
    width: 25px;
}


#left_panel_objects_object_data_list_grid_address{
    word-wrap: break-word;
    white-space: initial;
}

/*#################################################*/
/* REPORTS
/*#################################################*/

#report h1.title {
    margin: 0;
    color: #3970ca;
    display: table;
    float: left;
}
.version { font-size: 11px; font-weight: bold; color: #808080; }
#report .ui-jqgrid .ui-jqgrid-titlebar,

#report h1.title span { color: #808080; font-weight: 300; }
body#report { background: #f1f1f1; }




ul.pagination {
    text-align:center;
    color:#829994;
}
ul.pagination li {
    display:inline;
    padding:0 3px;
}
ul.pagination a {
    color:#4786d7;
    display:inline-block;
    padding:5px 10px;
    border:1px solid #6E9DFD;
    text-decoration:none;
}
ul.pagination a:hover,
ul.pagination a.current {
    background:#4786d7;
    color:#fff;
}


/*#################################################*/
/* REPORTS
/*#################################################*/

#reports_tabs .ui-tabs-nav
{
    border: 0px;
    padding: 2px;
}

#reports_tabs .ui-tabs-nav li
{
    border: 0px;
}

#reports_tabs .ui-tabs-nav li a
{
    padding: 2px 8px 1px;
}

#reports_tabs .ui-tabs-nav li.ui-tabs-active a
{
    padding: 2px 8px 1px;
}


#reports_tabs .ui-tabs-panel
{
    padding: 0px;
    padding-top: 3px;
}

#notification
{
    padding: 0px 3px;
    border-radius: 2px 2px 2px 2px;
    background-color: rgb(240, 61, 37);
    font-size: 8px;
    font-weight: bold;
    color: #fff;
    position: absolute;
    top: 2px;
    left: 290px;
}



/*#################################################*/
/* JQGRID.CSS OVERRIDE
/*#################################################*/

.ui-jqgrid .loading {background: #ffffff; font-weight: 600;}
.ui-jqgrid .ui-jqgrid-view { font-size: 11px;}
.ui-jqgrid .ui-jqgrid-titlebar { margin: 0 0 10px 0; padding: 0; }
.ui-jqgrid .ui-jqgrid-htable th div { height: auto; }
.ui-jqgrid .ui-jqgrid-hdiv { margin: 0 0 3px 0; background: #f5f5f5; clear: both; }
.ui-jqgrid .ui-jqgrid-hdiv thead { font-size: 12px; height: 24px; }
.ui-jqgrid .ui-jqgrid-htable th {height:13px; padding: 0px;}
.ui-th-column, .ui-jqgrid .ui-jqgrid-htable th.ui-th-column { height: 24px; }
.ui-th-ltr, .ui-jqgrid .ui-jqgrid-htable th.ui-th-ltr { border-left: 1px solid #e5e5e5; padding-top: 0px; }
.ui-th-ltr:first-child, .ui-jqgrid .ui-jqgrid-htable th.ui-th-ltr:first-child { border-left: none; }
.ui-jqgrid .ui-icon-asc,
.ui-jqgrid .ui-icon-desc { margin-left: 7px; margin-top:7px; height:5px; width: 9px; }
.ui-jqgrid .ui-jqgrid-pager { background: #f5f5f5; border-top: 1px solid #dddddd; margin: 3px -15px -15px -15px !important; padding: 2px 15px 0px 15px !important; height: 25px; }
.ui-jqgrid .ui-pg-input { font-size: 10px; height: 18px; margin: 2px 0; text-align: center; }
.ui-jqgrid .ui-pg-selbox { display: block; font-size: 10px; height: 18px; line-height: 18px; margin: 0; }
.ui-jqgrid .ui-separator { height: 0; border: none; }
.ui-jqgrid .ui-pg-table { padding: 0; }
.ui-jqgrid tr.jqgrow td { padding: 1px 2px; height: 17px;}
.ui-jqgrid tr.ui-row-ltr td span { display: inline-block; height: 17px; }
.ui-jqgrid .ui-jqgrid-btable {table-layout:fixed; margin:3px 0 0 0; outline-style: none;}
.ui-jqgrid .ui-state-hover { background: #f5f5f5; }
.ui-jqgrid th.ui-state-hover { background: none; }
.ui-jqgrid .ui-state-highlight, .ui-widget-content .ui-state-highlight, 
.ui-widget-header .ui-state-highlight { background: #f5f5f5; }
#cpanel .ui-jqgrid .ui-jqgrid-title { float: right; margin: auto; }
#cpanel .ui-jqgrid tr.ui-row-ltr td { padding: 3px; }


#traffic .inputbox_search {
    width: 300px;
    height: 28px;
    font-size: 14px;
    float: right;
    margin-left: 3px;
}


.ml10{
    margin-left: 10px;
}

.ml30{
    margin-left: 30px;
}


.object_plate_number{
    color: #228000;
    font-size: 13px;
}




/*#################################################*/
/* MENU
/*#################################################*/

.ui-menu { position: absolute; min-width: 150px; white-space: nowrap; z-index: 99999999; }
.ui-menu .ui-menu-icon {
    top: 8px;
}
.menu {
    background: #ffffff;
    -webkit-box-shadow: 0 0 5px 0 #9b9b9b;
    box-shadow: 0 0 5px 0 #9b9b9b;
}
.menu ul {
    background: #ffffff;
    -webkit-box-shadow: 3px 0 5px 0 #9b9b9b;
    box-shadow: 3px 0 5px 0 #9b9b9b;
}
.menu li { border-top: 1px solid #f5f5f5; }
.menu li:first-child { border: none; }
.menu li a:hover { background-color: #f5f5f5; }
.menu.ui-menu .first-item { border-top: 3px solid #2b82d4; }
.menu ul li a,
.menu .ui-menu-icon { background: url(images/ico/arrow.png) left center no-repeat; background-size: 10px 10px; overflow: visible; }
.menu.ui-menu .ui-menu-item a {
    background-repeat: no-repeat;
    background-position: 10px center;
    background-size: 10px 10px;
    padding: 5px 15px 5px 28px;
    color: #444444;
}

#streetView{
    display: none;
    position: absolute;
    bottom: 16px;
    right: 10px;
    width: 316px;
    height: 177px;
    background-color: #ffffff;
    padding: 2px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4);
    z-index: 15;
    opacity: 0.75;
    line-height: 177px;
    font-size: 20px;
    text-align: center;
    vertical-align: middle;
    color: #aaaaaa

}


.history_radio_button{
    margin-top: -1px;
    vertical-align: middle;
}

.mr-l-5{
    
    margin-left: 5px;
}


.travel_summary{
    
border: 1px solid #dddddd;
background-color: #fbfbfb;
height: 24px;
min-width: 78px;
color: #555555;
cursor: pointer;
text-align: center;
margin-bottom: 3px;
width: 92px;
margin-left: 12px;
padding: 2px;
color:#fab444;
    
}

.travel_summary span{
 color:#555555;   
}

.object_list_button_container {
  margin-bottom: 16px;
margin-top: 10px;
}
.object_list_button_container a {
    
    border: 1px solid #dddddd;
           background-color: #fbfbfb;
           height: 24px;
           min-width: 78px;
           color: #555555;
           text-align: center;
           margin-bottom: 3px;
           cursor: pointer;
           /*padding: 3px 8px;*/
           padding: 3px 5px;
}

.select_btn{
      background: #fab444 !important;
}
 

 #assign_visit_list_grid tr.jqgrow td {
        white-space: normal !important;
        
        padding :10px 2px !important;
        
        height: 25px !important;
    }
    
    #assign_sub_visit_list_grid tr.jqgrow td {
        white-space: normal !important;
        
        padding :10px 2px !important;
        
        height: 25px !important;
    }
    
.m-t-10{
 margin-top: 10px;   
}
 
.m-t-15{
 margin-top: 15px;   
}

.object_list_button_container {
 font-size: 10px;
}


.copy_field{
    display: flex;
    align-items: center;
    background-color: #4786d7;
    border-radius: 5px;
}

#dialog_track_share_link_content{
    border: 1px solid #212121;
    border-radius: 4px;
}
#dialog_track_share_link_content::-webkit-scrollbar{
    display: none;
}

#copy-btn{
    color: #fff;
    padding: 0 20px;
    font-size: 16px;
    cursor: pointer;
}

#otp_input {
    position: relative;
    display: none;
}

.otp_message_container {
    position:absolute;
    left:0;
}

.otp_message{
    color:red ;
    border:none;
    font-size: 13px;
    font-weight: 100;
    height: 50px;
}

.remember_container {
    position: absolute;
    right: 0 ;
    line-height:17px;
}

.remember_container input {
    height: 15px;
    margin-right: 5px;
}