/**
	Custom CSS for "Admin LTE 2.3.0 Theme"
 */
/*
 * Skin: CargoTrack Blue/Orange #29527B / #F68E36
 ruptela Blue/Gray: #2D5799 / #333333
 * ----------
 */
@media screen {
	html, body {
	  /* Make the body to be as tall as browser window */
	  height: 100%;
	}
	div.wrapper {
	  height: 100%;
	}
	div.content-wrapper {
	  overflow-y: auto; 
	  height: calc(100% - 40px);
	}
}

@media print {
	.content-header {
		display: block !important;
	}
}
 
 .main-header .navbar {
  background-color: #2D5799;
  min-height: 29px;
  border-bottom: solid 1px #284E89;
}
 .main-header .navbar .nav > li > a,
 .navbar-message > a {
  color: #ffffff;
}
.navbar-custom-menu > .navbar-nav > li > a,
.navbar-nav > li > a,
.navbar-message > a {
    padding-bottom: 9px;
    padding-top: 10px;
}
.navbar-nav > li > a {
	border-right: solid 1px #284E89;
}
@media (max-width:767px) {
 .navbar-nav > li > a {
  padding: 10px calc(calc(100vw / 8) - 7.5px);
 }
}
@media (max-width:991px) {
	.navbar-custom-menu > .navbar-nav > li {
		position: relative;
	}
	.navbar-custom-menu > .navbar-nav > li > .dropdown-menu {
		right: auto;
	}
}
 .main-header .navbar .nav > li > a:hover,
 .main-header .navbar .nav > li > a:active,
 .main-header .navbar .nav > li > a:focus,
 .main-header .navbar .nav .open > a,
 .main-header .navbar .nav .open > a:hover,
 .main-header .navbar .nav .open > a:focus,
 .main-header .navbar .nav > .active > a,
 .navbar-message > a:hover {
  background: rgba(0, 0, 0, 0.1);
  color: #f6f6f6;
}
 .main-header .navbar .sidebar-toggle {
  color: #ffffff;
}
 .main-header .navbar .sidebar-toggle:hover {
  color: #f6f6f6;
  background: rgba(0, 0, 0, 0.1);
}
 .main-header .navbar .sidebar-toggle {
  color: #fff;
}
 .main-header .navbar .sidebar-toggle:hover {
  background-color: #29527B;
}
 .navbar-message{
  float: left;
  color: #ffffff;
 }
  .navbar-message > a{
	display: block;
  	padding-left: 10px;
  	padding-right: 10px;
 }
 .navbar-device-selector{
  float: left;
  width: 140px;
  padding: 3px 3px 0px 3px;
 }
 
/*
@media (max-width: 767px) {
   .main-header .navbar .dropdown-menu li.divider {
    background-color: rgba(255, 255, 255, 0.1);
  }
   .main-header .navbar .dropdown-menu li a {
    color: #fff;
  }
   .main-header .navbar .dropdown-menu li a:hover {
    background: #29527B;
  }
}*/
 .main-header .logo {
  background-color: #222d32;
  color: #ffffff;
  border-bottom: 0 solid transparent;
}
 .main-header .logo:hover {
  background-color: #222d32;
}
 .main-header .logo .logo-lg img {
     width: 100%;
     height: auto;
 }


 .main-header li.user-header {
  background-color: #29527B;
}
 .content-header {
  background: transparent;
}
.wrapper {
	line-height: 0;
 }
.wrapper div{
	line-height: 1.42857;
 }
 .wrapper,
 .main-sidebar,
 .left-side {
  background-color: #222d32;
}
 .user-panel > .info,
 .user-panel > .info > a {
  color: #fff;
}
 .sidebar-menu > li.header {
  color: #4b646f;
  background: #1a2226;
}
 .sidebar-menu > li > a {
  border-left: 3px solid transparent;
}
 .sidebar-menu > li:hover > a,
 .sidebar-menu > li.active > a {
  color: #ffffff;
  background: #1e282c;
  border-left-color: #29527B;
}
 .sidebar-menu > li > .treeview-menu {
  margin: 0 1px;
  background: #2c3b41;
}
 .sidebar a {
  color: #b8c7ce;
}
 .sidebar a:hover {
  text-decoration: none;
}
 .treeview-menu > li > a {
  color: #8aa4af;
}
 .treeview-menu > li.active > a,
 .treeview-menu > li > a:hover {
  color: #ffffff;
}
 .sidebar-form {
  border-radius: 3px;
  border: 1px solid #374850;
  margin: 10px 10px;
}
 .sidebar-form input[type="text"],
 .sidebar-form .btn {
  box-shadow: none;
  background-color: #374850;
  border: 1px solid transparent;
  height: 35px;
  -webkit-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
 .sidebar-form input[type="text"] {
  color: #666;
  border-top-left-radius: 2px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 2px;
}
 .sidebar-form input[type="text"]:focus,
 .sidebar-form input[type="text"]:focus + .input-group-btn .btn {
  background-color: #fff;
  color: #666;
}
 .sidebar-form input[type="text"]:focus + .input-group-btn .btn {
  border-left-color: #fff;
}
 .sidebar-form .btn {
  color: #999;
  border-top-left-radius: 0;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 0;
}
.layout-top-nav .main-header > .logo {
  background-color: #29527B;
  color: #ffffff;
  border-bottom: 0 solid transparent;
}
.layout-top-nav .main-header > .logo:hover {
  background-color: #3b8ab8;
}

.btn-primary {
    /*background-color: #29527B;*/
    /*border-color: #29527B;*/
    background-color: #2D5799;
    border-color: #2D5799;
}
.btn-primary:hover, .btn-primary:active, .btn-primary.hover {
    background-color: #F68E36;
    border-color: #F68E36;
}

html {
	background-color: #999999;
}

.login-page, .register-page {
	background: none;
}
.login-box, .register-box {
    margin: 15% auto 0 auto;
    width: 360px;
}
@media (max-width: 600px) {
	.login-box, .register-box {
	    margin-top: 20px;
	    width: 80%;
	}
}
.login-box-footer {
    background: rgba(255, 255, 255, 0.6);
    padding: 5px 20px;
}

iframe.ruptela {
	width: 100%; 
	border: 0;
	background-color: #ffffff;
	height: calc(100vh - 40px);
	height: -o-calc(100vh - 40px); /* opera */
	height: -webkit-calc(100vh - 40px); /* google, safari */
	height: -moz-calc(100vh - 40px); /* firefox */
}
/*
@media (max-width: 785px) {
	iframe.ruptela {
		width: 100%; 
		border: 0;
		height: calc(100vh);
		height: -o-calc(100vh); 
		height: -webkit-calc(100vh);
		height: -moz-calc(100vh);
	}
	header.main-header {
		display: none;
	}
}
*/

.bg-primary {
    background-color: #2D5799;
    color: #fff;
}
.bg-blue {
    background-color: #2D5799 !important;
}
.box.box-primary {
    border-top-color: #2D5799;
}
.box-header > .fa, 
.box-header > .glyphicon, 
.box-header > .ion, 
.box-header .box-title {
    font-size: 16px;
}

.margin-top {
    margin-top: 20px;
}


/*** map style section ***/

div.ui-resizable-handle > a.resizable-handle-button {
	line-height: 20px;
	font-size:14px;
	position: absolute;
	z-index: 1020;
	color: #d2d6de !important; /*text-gray*/
}
div.ui-resizable-handle > a.resizable-handle-button-e {
	right: -15px;
	top: calc(50% - 40px);
	padding: 10px 2px;
}
div.ui-resizable-handle > a.resizable-handle-button-s {
	top: -15px;
	left: calc(50% - 20px);
	padding: 1px 14px 0px 14px;
	line-height: 14px;
}
div.ui-resizable-handle > a.resizable-handle-button:hover,
div.ui-resizable-handle > a.resizable-handle-button:focus,
div.ui-resizable-handle > a.resizable-handle-button:active {
	opacity: 1;
	color: #ffffff !important;
	background-color: #284e89 !important;
}


#mapViewLeftPanel {
	position: absolute; width: 400px; overflow-x: hidden; height: calc(100% - 40px);
}
#mapViewLeftPanel > div.box {
	border-top: 2px solid #d2d6de;
}
#mapViewLeftPanel .box-header.with-border {
	border-bottom: 0;
}
#mapViewLeftPanel .dataTables_filter label {
	padding-right: 3px;
}
#mapViewLeftPanel .dataTables_filter input[type="search"] {
	width: 100px;
}
#mapViewLeftPanel .dataTable .highlight {
	background-color: #D2D6DE;
}

#mapViewCenterPanel,
#mapViewCenterPanelWithoutLeftPanel {
	height: 100%;	
}
@media screen and (min-width: 768px) {
	#mapViewCenterPanel {
		position: relative; left: 400px; width: calc(100% - 400px);
	}
}
@media screen and (max-width: 767px) {
	#mapViewCenterPanel {
		width: 100% !important;
	}
}

#mapViewBottomPanel {
	height: 240px;
	overflow: hidden;
	background-color: #ffffff;
	display: none;
}
#mapViewBottomPanel dl{
	margin: 0;
}
#mapViewBottomPanel dt{
	text-align: right;
	float: left;
	width: 120px;
}
#mapViewBottomPanel dd{
	margin-left: 130px;
}
#mapViewBottomPanel .nav-tabs-custom {
	margin-bottom: 0;
	height: 100%;
}
#mapViewBottomPanel .tab-content,
#mapViewBottomPanel .full-content
{
	overflow-y: auto; 
	padding-bottom: 0;
}
#mapViewBottomPanel .full-content{
	height: 100%;
}
#mapViewBottomPanel .tab-content{
	height: calc(100% - 45px);
}

#mapViewBottomPanel .device-history .trip {
	padding: 1px 1px 1px 12px;
	border-bottom-left-radius: 3px;
	border-top-left-radius: 3px;
	background-color: #999999;
	cursor: pointer;
}
#mapViewBottomPanel .device-history .trip table {
	width: 100%;
	background-color: #ffffff;
} 
#mapViewBottomPanel .device-history .trip table td{
	background-color: #eeeeee;
	padding: 3px;
}
#mapViewBottomPanel .device-history .trip table tr td:nth-child(1){
	text-align: left;
}
#mapViewBottomPanel .device-history .trip table tr td:nth-child(2){
	text-align: center;
}
#mapViewBottomPanel .device-history .trip table tr td:nth-child(3){
	text-align: center;
	padding: 0px;
	width: 16%;
	border-left: solid 2px #B5BBC8;
}
#mapViewBottomPanel .device-history .trip table tr td.separator{
	height: 0px;
	padding: 0px;
	border-bottom: dashed 2px #B5BBC8;
}
#mapViewBottomPanel .device-history .trip table p{
	margin: 0;
	padding: 3px;
}
#mapViewBottomPanel .device-history .stop{
	padding: 4px 0px 4px 10px;
	cursor: pointer;
}
#mapViewBottomPanel .device-history .stop .stop-number{
	padding: 5px 10px; 
	font-size: larger; 
	font-weight: bold; 
	color: #fff;
	border-radius: 4px;
	background: linear-gradient(#dd4b39,#d33724);
}
#mapViewBottomPanel .device-history .stop .stop-duration{
	padding-left: 10px;
}

.background-gradient-red-yellow-0{
  background: linear-gradient(#DD4B39,#D33724) !important;
}
.background-gradient-red-yellow-12{
  background: linear-gradient(#DD4B39,#DD4B39,#DD4B39,#DD4B39,#DD4B39,#DD4B39,#DD4B39,#F39C12) !important;
}
.background-gradient-red-yellow-25{
  background: linear-gradient(#DD4B39,#DD4B39,#DD4B39,#DD4B39,#DD4B39,#DD4B39,#F39C12,#F39C12) !important;
}
.background-gradient-red-yellow-37{
  background: linear-gradient(#DD4B39,#DD4B39,#DD4B39,#DD4B39,#DD4B39,#F39C12,#F39C12,#F39C12) !important;
}
.background-gradient-red-yellow-50{
  background: linear-gradient(#DD4B39,#DD4B39,#DD4B39,#DD4B39,#F39C12,#F39C12,#F39C12,#F39C12) !important;
}
.background-gradient-red-yellow-62{
  background: linear-gradient(#DD4B39,#DD4B39,#DD4B39,#F39C12,#F39C12,#F39C12,#F39C12,#F39C12) !important;
}
.background-gradient-red-yellow-75{
  background: linear-gradient(#DD4B39,#DD4B39,#F39C12,#F39C12,#F39C12,#F39C12,#F39C12,#F39C12) !important;
}
.background-gradient-red-yellow-87{
  background: linear-gradient(#DD4B39,#F39C12,#F39C12,#F39C12,#F39C12,#F39C12,#F39C12,#F39C12) !important;
}
.background-gradient-red-yellow-100{
  background: linear-gradient(#F39C12,#ED9512) !important;
}

.leaflet-control-zoom a.leaflet-control-zoom-fit,
.leaflet-control-zoom a.leaflet-control-zoom-fit:hover,
.leaflet-control-zoom a.leaflet-control-zoom-fit:active,
.leaflet-control-zoom a.leaflet-control-zoom-fit:focus {
	color: black;
}
.leaflet-tooltip a{
	pointer-events: auto;
	color: #333;
}
.leaflet-tooltip a.highlight{
	font-weight: bold;
	text-decoration: underline;
}
.leaflet-tooltip a:hover{
	color: #333;
}




.live-history-map-pin{
	position: relative;
}
.leaflet-popup-content .stop-label,
.live-history-map-pin .stop-label{
	color: #ffffff;
	text-align: center;
	border-radius: 4px;
	background: linear-gradient(#dd4b39,#d33724);
}
.live-history-map-pin .stop-label{
	position: absolute;
	top: 5px;
	left: 4px;
	width: 17px;
	height: 18px;
	line-height: 18px;
	font-size: 10px;
	font-weight: bold;
}
.leaflet-popup-content .stop-label{
	width: 30px;
	height: 30px;
	line-height: 30px;
	font-size: 16px;
	font-weight: normal;
	margin-right: 10px;
}
.live-history-map-pin .stop-label.start-label,
.live-history-map-pin .stop-label.finish-label{
	background: none;
}
.leaflet-popup-content .stop-label.start-label{
	background: #777;
}
.leaflet-popup-content .title{
  font-size: larger;
}
.leaflet-popup-content .border-bottom{
  border-bottom: solid 2px #2D5799;
}
.leaflet-popup-content dl.dl-horizontal{
    margin: 10px 0 0 0;
}
.leaflet-popup-content dt{
    width: 80px;
    float: left;
    text-align: right;
}
.leaflet-popup-content dd{
    margin-left: 90px;
}

@media screen and (max-width: 767px) {
	div.daterangepicker > div.calendar.left,
	div.daterangepicker > div.calendar.right,
	div.daterangepicker > div.ranges > div.range_inputs,
	div.daterangepicker > div.ranges > ul > li:nth-child(6),
	div.daterangepicker > div.ranges > ul > li:nth-child(7),
	div.daterangepicker > div.ranges > ul > li:nth-child(8) {
		display: none;
	}
}

a.logo-text {
	color: #F68E36;
}
a.logo-text > span {
	color: #29527B;
}

.padding-left {
	padding-left: 10px;
}
.margin-left {
	margin-left: 10px;
}



.navbar-nav > .user-menu > .dropdown-menu{
	width: 190px;
}
.navbar-nav > .user-menu > .dropdown-menu > li > a{
	padding: 7px 20px;
}
@media (max-width:991px) {
 .navbar-nav .dropdown-menu > li.active > a {
  background-color: #337ab7;
 }
}

@media (max-width: 767px) {
	.main-sidebar, .left-side {
		padding-top: 50px;
	}
}

.main-header .navbar .logo {
	float: left;
	width: auto;
	background-color: #3C8DBC;
}


aside.control-sidebar-for-map {
    right: -360px;
    width: 360px;
	height: 100%;
	overflow: hidden; 
	padding-top: 50px;
}

aside.control-sidebar-for-map div.dataTables_wrapper{
	height: calc(100vh - 50px);
	height: -o-calc(100vh - 50px); /* opera */
	height: -webkit-calc(100vh - 50px); /* google, safari */
	height: -moz-calc(100vh - 50px); /* firefox */
	
	overflow-x: hidden;
	overflow-y: auto;
	padding-top: 10px;
}
aside.control-sidebar-for-map div.dataTables_wrapper div.col-sm-6 {
	width: 100%;
}
aside.control-sidebar-for-map div.dataTables_wrapper  div.dataTables_filter {
	text-align: center;
}

.leaflet-popup-content-wrapper {
	border-radius: 2px;
}

.map-history-parameters { 
	width: 50%;
	float: left;
	height: calc(100vh - 50px);
	height: -o-calc(100vh - 50px); /* opera */
	height: -webkit-calc(100vh - 50px); /* google, safari */
	height: -moz-calc(100vh - 50px); /* firefox */
	overflow: auto;
	background-color: #fff;
}
.map-history { 
	width: 50%;
	float: right;
	height: calc(100vh - 50px);
	height: -o-calc(100vh - 50px); /* opera */
	height: -webkit-calc(100vh - 50px); /* google, safari */
	height: -moz-calc(100vh - 50px); /* firefox */
	overflow: hidden; 
}

.map-history-parameters #accordion .box-body{
	background-color: #ECF0F5;
} 

/* date time picker */
dt.ui_tpicker_second_label, dd.ui_tpicker_second, dt.ui_tpicker_millisec_label, dd.ui_tpicker_millisec, dt.ui_tpicker_microsec_label, dd.ui_tpicker_microsec, dt.ui_tpicker_timezone_label, dd.ui_tpicker_timezone, dt.ui_tpicker_hour_label, dt.ui_tpicker_minute_label {
	display: none;
}
dt.ui_tpicker_time_label {
	float: left;
	width: 42%;
}
dd.ui_tpicker_hour, dd.ui_tpicker_minute {
	float: left;
	width: 50%;
	padding-left: 10px;
	padding-right: 10px;
}

/* data tables */
table.dataTable thead .sorting::after, table.dataTable thead .sorting_asc::after, table.dataTable thead .sorting_desc::after {
	left: 8px;
	right: auto !important;	
}
table.dataTable thead > tr > th {
    padding-right: 0px;
    padding-left: 30px;
}
table.dataTable.table-condensed.live-map-device-list thead > tr > th {
    padding-right: 12px;
    padding-left: 0px;
}
table.dataTable tr.emphasis td{
    color: red;
}
div.table-responsive div.dataTable_wrapper div.row,
div.table-responsive div.row.year-filter {
	margin-left: 0;
	margin-right: 0;
}
div.table-responsive div.dataTable_wrapper div.row div.col-sm-12,
div.table-responsive div.row.year-filter div.col-sm-12 {
	padding-left: 0;
	padding-right: 0;
}

.remember-me-checkbox {
	margin: 2px 0 1px 0;
}

.year-filter {
	margin-bottom: 10px;
}

/* generic tools */
.hidden-tools-container > .hidden-tools {
    display: none;
    float: right;
}
.hidden-tools-container > .hidden-tools > .fa, .hidden-tools-container > .hidden-tools > .glyphicon, .hidden-tools-container > .hidden-tools > .ion {
    cursor: pointer;
    margin-right: 5px;
}
.hidden-tools-container:hover > .hidden-tools {
    display: inline-block;
}

.text-middle {
	vertical-align: middle !important;
}

.col-xs-2 > .form-control {
	padding: 6px 8px;	
}

.tools > a {
	color: #dd4b39;
}

.bg-blueblack {
    background: #222D32 !important;
}
html.bg-blueblack div.login-logo{
	background: #fff;
	padding-top: 20px;
	margin-bottom: 0;
}

.marker-cluster-small,
.marker-cluster-medium,
.marker-cluster-large {
	background-color: rgba(45, 87, 153, 0.5);
	}
.marker-cluster-small div,
.marker-cluster-medium div,
.marker-cluster-large div {
	background-color: rgba(45, 87, 153, 0.8);
	color: #ffffff;
	font-weight: bold;
	}
	
.dropdown-menu .divider{
	margin: 4px 0;
}
.dropdown-menu > li > a {
	padding: 7px 20px;
}

.btn-app{
	height: auto;	
}
.btn-app.report{
	width: 100px;
}

.multiselect-container {
	min-width: 100%;
}
.multiselect-container > li > a {
	padding: 0px;
}
.multiselect-container > li > a > label {
    padding: 5px 20px 5px 35px;
    font-weight: normal;
}
.multiselect-container > li.multiselect-group label {
	padding: 5px 20px 5px 15px;
}
.multiselect-container > li.multiselect-group > a > label > input[type="checkbox"] {
	margin-right: 4px;
}
button.multiselect {
    text-align: left;
}
button.multiselect b.caret {
    position: absolute;
    right: 10px;
    top: 15px;
}

.table tr td .progress {
    background-color: #eeeeee;
}

.table tr > td.border-accent-right,
.table tr > th.border-accent-right {
	border-right: 2px solid #cccccc;
}

.table tr > td.border-accent-left,
.table tr > th.border-accent-left {
	border-left: 2px solid #cccccc;
}

/* DataTable fixed columns */
div.DTFC_LeftBodyLiner {
	overflow: hidden !important;
}

.table-striped > tbody > tr.processing {
    background-color: #a7e4f2 !important;
}
.table-striped > tbody > tr.processing td{
	border-top: 0 !important;
}



/* custom tabs */
.nav-tabs-custom > .nav-tabs.tabs_green > li.active {
    border-top-color: #00a65a;
}
.nav-tabs-custom > .nav-tabs.tabs_green > li.active > a > i{
    color: #008D4C;
}


label.icon-checkbox {
	margin-top: 5px;	
}
label.icon-checkbox > i{
	padding: 4px 6px 4px 4px;
	vertical-align: middle;
	background: #2E5999;
	color: #FFFFFF;	
}


div.centerMiddle {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}