html, body {
	min-height: 100vh;
	background:#1e2124;
	margin:0;
	padding:0;
	font-family: 'Roboto', sans-serif;
	
}

@font-face {
  font-family: 'icomoon';
  src:  url('../fonts/icomoon.eot?2naug0');
  src:  url('../fonts/icomoon.eot?2naug0#iefix') format('embedded-opentype'),
    url('../fonts/icomoon.ttf?2naug0') format('truetype'),
    url('../fonts/icomoon.woff?2naug0') format('woff'),
    url('../fonts/icomoon.svg?2naug0#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-stopwatch:before {
  content: "\e900";
}
.icon-tool:before {
  content: "\e901";
}
.icon-carbroken:before {
  content: "\e902";
}
.icon-carstatus:before {
  content: "\e903";
}

/*
Login start	
*/
#loginpage {
	background:#434F59;
	display:flex;
	flex-direction:row;
	}
.form-signin {
		text-align:center;
        width: 400px;
        padding: 19px 29px 29px;
        margin: auto;
        background-color: #fff;
        border: 1px solid #e5e5e5;
        -webkit-border-radius: 5px;
           -moz-border-radius: 5px;
                border-radius: 5px;
     -webkit-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.75);
box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.75);
      }
      .form-signin img {
	      width:50px;
	      margin-right:10px;
	      }
  
      .form-signin input[type="text"],
      .form-signin input[type="password"] {
	      /*border:1px solid #5C6770;
	      border-top: 3px solid #5C6770;*/
	      
        font-size: 21px;
        height: auto;
        margin-bottom: 15px;
        padding: 7px 9px;
        
      }
     .form-signin-heading {
	     padding-bottom:25px;
	     font-size:16px;
     }
     
/*
Login end
*/
#listrallies {
	background:#434F59;
	display:flex;
	flex-direction:row;
	}
#listrallies div.panel {
	width: 400px;
	margin:auto;
	-webkit-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.75);
box-shadow: 1px 1px 2px 0px rgba(0,0,0,0.75);
	}

#status {
	height:10px;
	margin-bottom:5px;
}
#status.offline {
	background:url("../imgs/offline.png");
	}
.logo {
	display:inline-block;
	height:46px;
	background:url("../imgs/logo.png") no-repeat;
	font-size:17px;
	color:#d6d7d7;
	line-height:46px;
	padding-left:20px;
}
.logo:hover {
	color:#e4e5e5;
	text-decoration:none;
}
.logo img {
	display:block;
	width:45px;
	float:left;
	margin-right:10px;
	}
.logo span {
	display:block;
	text-align:right;
	font-size:12px;
	font-style:italic;
	line-height:12px;
	margin-top:-10px;
	color:#A1A3A4;
	font-weight:300;
	}
header nav {
	
}
header nav ul {
	margin:0;
	padding:5px 0 0 0;
}
header nav li {
	display:inline;
	font-size:17px;
	margin:0;
	padding:0;
}
header nav a {
	display:inline-block;
	color:#889299;
	margin:0 10px;
	padding:15px 5px;
}
header nav a:hover, header nav .current a {
	color:#fff;
	text-decoration:none;
	border-bottom:3px solid #ffd50f;
}

#user-pref, 
.user-pref {
	text-align:right;
}

#user-pref a, 
.user-pref {
	font-size:24px;
	color:#5e6870;
	display:inline-block;
	padding:15px 10px 0 15px;
}
#user-pref a:hover,
.user-pref:hover {
	color:#fff;
}

#rally-time,
#rally-time-label {
	font-size:18px;
	color:#fff;
	display:inline-block;
	padding:20px 0px 0 10px;
}
#rally-time-label {
	color:#5e6870;
}

#app-container {
	display: flex;
	flex-direction: column;
	justify-content:space-between;
	/*min-height: 100vh;*/
	position:absolute;
	width: 100%;
  height: 100%;
  min-height:100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
	
	}
#main-screen {
	
	flex:1;
	background:#d8d8d8;
	display: flex;
	flex-direction: column;
	min-height: 0;
	position: relative;
	}
	
#map {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	width:100%;
	height:100%;
	}
#car-toolbar {
	display:flex;
	flex-direction:row;
	
	}
#car-toolbar a {
	margin:auto 0 auto 10px;
	}
#car-toolbar input {
	border:2px solid #5D6871;
        padding: 6px 12px;
        width: 100px;
	}
.locked {
	display:block;
	background:#545e68;
	margin:auto 0 auto 10px;
	padding:5px 12px;
	color:#fff;
	border-radius: 4px;
	}

.panneau {
	display:none;
	position:absolute;
	right:0;
	top:0;
	/* width:25%; this value is now modified by Javascript into toggleSlidePanel() function */
	height:100%;
	background:#2a3036;
	z-index: 600;
	-webkit-box-shadow: -2px -1px 8px -4px rgba(0,0,0,0.75);
-moz-box-shadow: -2px -1px 8px -4px rgba(0,0,0,0.75);
box-shadow: -2px -1px 8px -4px rgba(0,0,0,0.75);
}

th.sorting{
	background-image: none !important;
}
/* 
	other arrows :⇕ ⇳ ⇅ ⇵ ⇈ ⇊ ⏬ ⏫ ↓ ⇓ ⇡
	https://stackoverflow.com/a/22156412/13169665
*/
th.sorting:after{
	content: ' ⇅'; 
	color: #dcdcdc;
	font-weight: bold;
}
th.sorting_asc{
	background-image: none !important;
} 
th.sorting_asc:after{
	content: ' ⇡';
	color: #6199d4;
	font-weight: bold;
} 
th.sorting_desc{
	background-image: none !important;
} 
th.sorting_desc:after{
	content: ' ⇣';
	color: #6199d4;
	font-weight: bold;
} 

#pilotinputnum {
	border-left: 8px solid #ffd50f !important;
	border-bottom: 6px solid #ffd50f !important;
	font-weight: bold;
}

.pilotinput-reference {
	border-bottom: 2px solid #ffd50f !important;
}

#racedatapilot{
	font-weight: bold;
}

@media screen and (max-width: 1100px) {
	.panneau {
		width:35%;
	}
	#pilotinputnum {
		min-width: 100px;
	}
	#pilotcarlock-span {
		width: 80px;
	}
	#clusterenable-span {
		width: 80px;
	}
	#alertfocus-span {
		min-width: 120px;
		width: 120px;
	}
}
.panneau .panneau-header {
	display:block;
	position:relative;
	background:#0C0D0F;
	color:#fff;
	padding:10px 30px;
	border-bottom:1px solid #9E9FA0;
	}
.panneau .panneau-header:hover {
	text-decoration:none;
}
.panneau .panneau-header:after {
	font:normal normal normal 14px/1 FontAwesome;
	content:"\f078";
	color:#B5B7B8;
	font-size:15px;
	position:absolute;
	right:30px;
	}

.panneau .sort-items {
	display:block;
	color:#6B6F73;
	font-size:12px;
	
}
.panneau .sort-items:before {
	font:normal normal normal 14px/1 FontAwesome;
	content:"\f0dc";
	color:#8F9295;
	padding-right:5px;
	}
.panneau .btn-group {
	margin:10px 30px;
}
#panneau-4 .btn-group {
	margin:10px 15px 0px !important;
}
#panneau-4 .gps-details-button {
	margin-top :10px !important;
	padding-right :50px !important;
}
	
	.list-container {
		margin:15px 15px 15px 15px;
		padding:0 15px 0 0;
		max-height: calc(100% - 71px);
		overflow: auto;
	}
	
	#panneau-3 .list-container {
		max-height: calc(100% - 150px);
		}
	#panneau-4 .list-container {
		max-height: calc(100% - 110px);
		}
	#panneau-5 .list-container {
		max-height: calc(100% - 110px);
		}
/*
.panneau .list-alerts {
	margin:0 15px 0 30px;
	padding:0;
}
.panneau .list-alerts li {
	display:inline-block;
	margin:0;
	padding:1px 0;
	width:100%;
	
}
.panneau .list-alerts li a {
	background:#3c3f42;
	display:flex;
	flex-direction: row;
	justify-content:space-between;
	border-left:6px solid #d0011b;
	padding:5px 0;
	border-radius:4px;
	
}
.panneau .list-alerts li a:after {
	font:normal normal normal 14px/1 FontAwesome;
	content:"\f054";
	color:#B5B7B8;
	font-size:12px;
	padding:0 5px;
	margin: auto;
	}
.panneau .list-alerts li a:hover {
	text-decoration:none;
	}
.panneau .list-alerts li a span {
	padding:0 2px;
}
.panneau .list-alerts li a span:nth-child(1) {
	color:#808283;
	font-size:15px;
	min-width:50px;
	text-align:right;
	}
.panneau .list-alerts li a span:nth-child(2) {
	color:#fff;
	font-size:14px;
	flex:1;
	}
.panneau .list-alerts li a span:nth-child(3) {
	color:#dededf;
	font-size:11px;
	}
	*/
	
/*
.panneau table.list-alerts {
	margin:0 5px 0 5px;
	padding:0;
}
*/

.panneau .list-alerts thead {
	display:none;
}

.panneau .list-alerts tr  {
	display:flex;
	justify-content:space-between;
	border-left:6px solid #d0011b;
	border-right:6px solid #3c3f42;
	padding:0px 0;
	border-radius:4px;
	margin-bottom:1px;
}
table.dataTable.list-alerts tbody tr {
	background:#3c3f42;
}
.panneau table.dataTable tbody th, .panneau table.dataTable tbody td {
	padding:5px 2px;
}
.panneau .list-alerts tr td {
	background:#3c3f42;
	color:#fff;
	cursor:pointer;
	
}
.panneau .list-alerts tr td:nth-child(1) {
	font-size:15px;
	min-width:40px;
	text-align:right;
	 color: #808283;
	}
.panneau .list-alerts tr td:nth-child(2) {
	font-size:14px;
	flex:1;
	}
.panneau .list-alerts tr td:nth-child(3) {
	font-size:11px;
	color:#dededf;
	vertical-align:center;
	}
	
.panneau .list-alerts tr td:nth-child(3):after {
	display:inline-block;
	font:normal normal normal 14px/1 FontAwesome;
	content:"\f054";
	color:#B5B7B8;
	font-size:12px;
	padding:0 0 0 5px;
}

.technical-alert-user-params{
	color: #B5B7B8;
	text-align: right;
}


.panneau .list-chrono thead tr {
	background:#3c3f42;
	color:#B5B7B8 !important;
}
.panneau .list-chrono thead tr th,
.panneau .list-chrono tbody tr td {
	text-align: right;
	padding: 5px 2px;
}
table.dataTable.list-chrono tbody tr:hover{
	background-color: #55585b !important;
}
.panneau .list-chrono tr  {
	border-left:6px solid #d0011b;
	border-right:6px solid #3c3f42;
	padding:0px 0;
	border-radius:4px;
	margin-bottom:1px;
}
.panneau .list-chrono tbody tr {
	background:#3c3f42;
	color:#fff;
	cursor:pointer;
}

.panneau .list-chrono tr th.chrono-wpname,
.panneau .list-chrono tr td.chrono-wpname {
	font-size:14px;
	width:100% !important;
	min-width:100% !important;
	max-width:100% !important;
}
.panneau .list-chrono tr th.chrono-timestamp,
.panneau .list-chrono tr td.chrono-timestamp {
	font-size:14px;
	width: 100px !important;
	min-width: 100px !important;
	max-width: 100px !important;
	text-align:center;
	/* flex:1; */
}
.panneau .list-chrono tr th.chrono-day
.panneau .list-chrono tr td.chrono-day {
	font-size:14px;
	width:40px !important;
	min-width:40px !important;
	max-width:40px !important;
	vertical-align:center;
}
	
/* .panneau .list-chrono tr td:nth-child(3):after {
	display:inline-block;
	font:normal normal normal 14px/1 FontAwesome;
	content:"\f054";
	color:#B5B7B8;
	font-size:12px;
	padding:0 0 0 5px;
	} */

/* table.dataTable,
table.dataTable th,
table.dataTable td {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
} */

.autoshow-technical-switcher {
	background:#545e68;
	margin-top: 20px !important;
	padding:8px 12px;
	color:#fff;
	border-radius: 4px;
}

.badge-car-status {
	border: solid 1px #3c3f42 !important;
	background-color: white !important;
	color: #3c3f42 !important;
}
.panneau .list-carstatus thead {
	background: #3c3f42;
	color:#B5B7B8;
	position: sticky;
	top: 0px;
}

.panneau .list-carstatus tr  {
	/*display:flex;*/
	/*justify-content:space-between;*/
	border-left:6px solid #d0011b;
	border-right:6px solid #3c3f42;
    text-align: center;
	margin-bottom:1px;
}
.panneau #table-carstatus thead th, 
.panneau #table-carstatus tbody td {
	padding: 0px 0px 0px 0px !important;
	margin: 0px 0px 0px 0px !important;
	text-align: center;
	/* line-height: 1; */
}
table.dataTable.list-carstatus tbody tr {
	background:none;
}
table.dataTable.list-carstatus tbody tr:hover{
	background-color: #3c3f42 !important;
}
.panneau .list-carstatus tr td {
	/*background:#3c3f42;*/
	color:#fff;
	cursor:pointer;
}
.panneau .list-carstatus tr th.status-rn,
.panneau .list-carstatus tr td.status-rn {
	font-size:17px;
	font-weight: bold;
	width: 20px;
	min-width:20px;
	max-width:20px;
	text-align:center;
	color:#fff;
}
.panneau .list-carstatus tr th.status-rn{
	font-size:14px !important;
}
.panneau .list-carstatus tr th.status-gprs,
.panneau .list-carstatus tr td.status-gprs {
	font-size:14px;
	width: 20px;
	min-width:20px;
	max-width:20px;
	/* wflex:1; */
	text-align:center;
}
.panneau .list-carstatus tr th.status-gps,
.panneau .list-carstatus tr td.status-gps {
	font-size:14px;
	width: 20px;
	min-width:20px;
	max-width:20px;
	vertical-align:center;
	text-align:center;
}
.panneau .list-carstatus tr th.status-nbsat,
.panneau .list-carstatus tr td.status-nbsat {
	font-size:14px;
	width: 20px;
	min-width:20px;
	max-width:20px;
	vertical-align:center;
	text-align:center;
}
.panneau .list-carstatus tr th.status-maxsat,
.panneau .list-carstatus tr td.status-maxsat {
	font-size:14px;
	width: 25px;
	min-width:25px;
	max-width:25px;
	vertical-align:center;
	text-align:center;
}
.panneau .list-carstatus tr th.status-avgsat,
.panneau .list-carstatus tr td.status-avgsat {
	font-size:14px;
	width: 25px;
	min-width:25px;
	max-width:25px;
	vertical-align:center;
	text-align:center;
}
.panneau .list-carstatus tr th.status-power,
.panneau .list-carstatus tr td.status-power {
	font-size:14px;
	width: 20px;
	min-width:20px;
	max-width:20px;
	vertical-align:center;
	text-align:center;
}
.panneau .list-carstatus tr th.status-vbat,
.panneau .list-carstatus tr td.status-vbat {
	font-size:14px;
	width: 20px;
	min-width:20px;
	max-width:20px;
	vertical-align:center;
	text-align:center;
}
.panneau .list-carstatus tr th.status-date,
.panneau .list-carstatus tr td.status-date {
	width: 40px;
	min-width:40px;
	max-width:40px;
	vertical-align:center;
	text-align:center;
}

#table-car-status-count{
	color: #3c3f42;
	font-size: bold;
}

.panneau .list-overspeed thead {
	background: #3c3f42;
	color:#B5B7B8;
	/* position: sticky; */
	top: 0px;
}
.panneau .list-overspeed thead tr th,
.panneau .list-overspeed tbody tr td {
	text-align: center !important;
	padding: 5px 5px !important;
}
.panneau .list-overspeed tbody tr:hover{
	background-color: #3c3f42 !important;
}
.panneau .list-overspeed tr  {
	/* display:flex; */
	/* justify-content:space-between; */
	border-left:6px solid #d0011b;
	border-right:6px solid #3c3f42;
	text-align: center;
	padding:0px 0;
	border-radius:4px;
	margin-bottom:1px;
}
table.dataTable.list-overspeed tbody tr {
	background:none;
}
.panneau .list-overspeed thead tr th:nth-child(1),
.panneau .list-overspeed tbody tr td:nth-child(1) {
	width:80px;
	min-width:80px;
	max-width:80px;
	text-align:center;
        border: 1;
	}
.panneau .list-overspeed thead tr th:nth-child(2),
.panneau .list-overspeed tbody tr td:nth-child(2),
.panneau .list-overspeed thead tr th:nth-child(3),
.panneau .list-overspeed tbody tr td:nth-child(3),
.panneau .list-overspeed thead tr th:nth-child(4),
.panneau .list-overspeed tbody tr td:nth-child(4) {
	width:15px;
	min-width:15px;
	max-width:15px;
}
.panneau .list-overspeed thead tr th:nth-child(5),
.panneau .list-overspeed tbody tr td:nth-child(5) {
	width:30px;
	min-width:30px;
	max-width:30px;
}
.panneau .list-overspeed tr td {
	/* background:#3c3f42; */
	color:#fff;
	cursor:pointer;
	
}
.panneau .list-overspeed tr td:nth-child(1) {
	font-size:16px;
	min-width:20;
	max-width:20;
	text-align:center;
	color:#fff;
	}
.panneau .list-overspeed tr td:nth-child(2) {
	font-size:14px;
	min-width:20;
	max-width:20;
	/* wflex:1; */
	text-align:center;
}
.panneau .list-overspeed tr td:nth-child(3) {
	font-size:14px;
	min-width:20;
	max-width:20;
	vertical-align:center;
	text-align:center;
	}
.panneau .list-overspeed tr td:nth-child(4) {
	font-size:14px;
	min-width:20;
	max-width:20;
	vertical-align:center;
	text-align:center;
	}
.panneau .list-overspeed tr td:nth-child(5) {
	font-size:14px;
	min-width:20;
	max-width:20;
	vertical-align:center;
	text-align:center;
	}
	
th .gmt-offset {
	color: white;
	font-size: 10px;
}

footer {
	border-top:10px solid #1e2124;
	padding:10px 0;
	background:#444f58;
	z-index: 700;
}
.btn.show-panneau {
	text-align:left;
	position:relative;
	padding:3px 12px;
	margin-right:10px;
}
.btn.show-panneau .badge {
	position:absolute;
	right:-5px;
	top:-5px;
}
.btn-default.show-panneau {
	background-color:#637380;
	border:0;
	color:#fff;
	}
.btn-default.show-panneau.active {
	  color: #333;
    background-color: #d4d4d4;
    border-color: #8c8c8c;
}
  

.show-panneau {
	display:inline-block;
	font-size:18px;
}
.col-xs-3 .show-panneau:last-child {
	margin-right:0;
}
/*
.show-panneau .fa {
	font-size:16px;
	float:right;
	margin-left:20px;
}
*/
.notvisible {
	opacity: 0.2;
}
.bold {
	font-weight:700;
}
.red {
	color:red;
}
.grey {
	color:#9B9B9B;
}
.tripy-yellow {
	color: #ffd50f
}
.track-active {
	color: #3c3c3c !important;
	background-color: #ffd50f !important;
}
.modal-subheader {
	padding: 15px;
    border-bottom: 1px solid #e5e5e5;
}
.modal-dialog{
    overflow-y: initial !important
}
.modal-body{
     max-height: calc(100vh - 212px);
    overflow-y: auto;
}
.status {
	display:inline-block;
	width:50px;
	border:1px solid #000;
	color:#fff;
	border-radius:3px;
	font-size:12px;
	text-transform: uppercase;
	text-align:center;
	line-height:20px;
}
.status.on {
	background:#1DB000;
}
.status.off {
	background:#FF1800;
}
.status.gprs {
	background:#666666;
}
.battery {
	display:inline-block; position: relative; z-index: 1; width:50px; height:22px; vertical-align: middle;
}
.voltage {
	display:inline-block;
	font-size:11px;
	vertical-align: middle;
	padding-left:5px;
	}
.battery span {
	position:absolute;
	display:inline-block;
	width:50px;
	border:1px solid #000;
	font-size:12px;
	line-height:18px;
	border-radius:3px;
	height:22px;
	background:#fff;
	padding:3px 0 3px 3px;
}
.battery span::after {
	
	display:block;
	width:9px;
	height:10px;
	background:#000;
	content:"";
	top:4px;
	border-radius:2px;
	right:-4px;
	position:absolute;
	z-index:-9;
	
	}
.battery span i {
	display:inline-block;
	width:8px;
	height:100%;
	margin:0 3px 0 0;
	background:#EDEDED;
	}
	.battery span i.on {
		background:#1DB000;
		}
	.battery span i.gprs {
	        background:#666666;
		}

/* OVERRIDE BOOTSTRAP */
.modal-content {
	border-top:6px solid #FFD50F;
}
.badge, .btn-default .badge {
	background-color:#D0011B;
	}
.badge-white, .btn-default .badge-white {
	background-color:white;
}
.btn {
	text-transform:uppercase
}
.btn-default {
	color: #fff;
    background-color: #637380;
    border:0;
}
.btn-selected {
	color: #fff;
    background-color: #9eaebc;
    border:0;
}
.pagination {
	margin:0;
}


/*
LAYER SWITCHER OVERRIDE	
*/

#app-container .layer-switcher {
    top: auto;
    bottom:0.5em;
    right: auto;
    left:0.5em;
    border-radius:0;
    background:none;
    padding:0;
	z-index: 9999;
}

#app-container .layer-switcher button {
    float: none;
    position:relative;
    width: auto;
    height: auto;
    background: #53595F;
    padding:10px 55px 10px 15px;
    text-transform:uppercase;
	color: white;
}

#app-container .layer-switcher .panel {
	border: none;
	max-height: 50vh;
	width: 190px;
}
.switcher-closebutton{
	width: 190px;
}

.switcher-openbutton:after,
.switcher-closebutton:after {
	position:absolute;
	right:15px;
}
.switcher-closebutton:before {
	content:'Close Map Options' !important;
}
.switcher-closebutton:after{
	font:normal normal bold 14px/1 Arial !important;
	content:"X" !important;
}
.switcher-openbutton:before {
	content:'Show Map Options' !important;
}
.switcher-openbutton:after{
	font:normal normal normal 14px/1 FontAwesome !important;
	content:"\f078" !important;
}

#app-container .ol-control button {
	line-height:14px;
	font-size:12px;
	
}

#app-container .ol-control {
	background:none;
	border-radius:0;
	padding:0;
}

#app-container .ol-zoom .ol-zoom-in, #app-container .ol-zoom .ol-zoom-out {
	border-radius:0;
}

#app-container .ol-control.ol-zoom button {
	background: #53595F;
	line-height:14px;
	font-size:21px;
	margin:0 0 3px 0;
	}
.body {
	max-width:855px;
	width:100%;
	margin:0 auto;
	padding-top:20px;
}

/*
.ol-scale-line {
position: absolute;
width: auto;
bottom: 0.25em;
left: 18%;
}
*/
.ol-scale-line {
  bottom: 0.5em;
  left: auto;
  right: 2.7em;
  background: rgba(96, 96, 96, 0.9);
  /* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); */
  /* border-radius: 2px; */
  /* border: 1.5px solid #703841ff; */
}

#app-container .ol-custom-cluster{
	position:absolute;
	background: #53595F;
	font-size:19px;
    line-height:10px;
	z-index: 999999;
    width: 40px;
    margin: 0 3px 0;
    /* adding:10px 40px 10px 15px; */
    text-transform:uppercase;
    top: 120px;
    left: 6px;
}

#app-container .ol-custom-measure{
    position:absolute;
    /* background: #53595F; */
    font-size:19px;
    line-height:10px;
    z-index: 500;
    /* width: 40px; */
    margin: 0 3px 0;
    /* padding:10px 10px 10px 10px; */
    text-transform:uppercase;
    top: 85px;
    left: 6px;
}

#resetMapPos{
    position:absolute;
    z-index: 500;
    top: 15px;
    left: 45px;
}

#app-container #my-location{
    position:absolute;
    font-size:35px;
	max-width:35px;
	max-height:35px;
	line-height:35px;
	color: white;
    z-index: 500;
    margin: 0px 3px 0px 3px;
	padding: 0;
    top: 115px;
    left: 6px;
	border-radius: 40px;
	background-color: #53595F;
}
#app-container #my-location button{
	border-radius: 40px;
	border-width: 0px;
	background-color: #53595F;
}

#app-container .ol-cluster{
	width: 60px;
}

#app-container .ol-measure{
	width: 60px;
}

.ol-tooltip {
        position: relative;
        background: rgba(0, 0, 0, 0.5);
        border-radius: 4px;
        color: white;
        padding: 4px 8px;
        opacity: 0.7;
        white-space: nowrap;
        font-size: 12px;
}
.ol-tooltip-measure {
        opacity: 1;
        font-weight: bold;
}
.ol-tooltip-static {
        background-color: #ffcc33;
        color: black;
        border: 1px solid white;
}
.ol-tooltip-measure:before,
.ol-tooltip-static:before {
        border-top: 6px solid rgba(0, 0, 0, 0.5);
        border-right: 6px solid transparent;
        border-left: 6px solid transparent;
        content: "";
        position: absolute;
        bottom: -6px;
        margin-left: -7px;
        left: 50%;
}
.ol-tooltip-static:before {
        border-top-color: #ffcc33;
}
.btn .btn-tool{
    background-color: #0000ff;
}
.btn .btn-tool1:active {
    background-color: #800000;
}
.btn_on {
   color: #00C000;
}
.btn_off {
   color: #202020;
}
.popover_parent {
    position: relative;
}
.popover_child {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}
.popover_child2 {
    z-index: 1;
}

/* track modal */
input[name="time_track"]{
	width: 18px!important;
}
#ModalTrack h4,
#ModalTrack label,
#ModalTrack input[type="radio"] {
	cursor: pointer;
}

#race-start-datetime,
#race-end-datetime {
	color:#434F59
}
#race-start-datetime,
#race-end-datetime {
	font-weight: bold;
}

.toast {
	z-index: 9999;
	position: absolute; 
	top: 1rem; 
	right: 1rem; 
	text-align: center;
	background-color: white;
	border-radius: 5px;
	border: 1px solid #333;
	padding: 5px 15px 5px 15px;
}

.blue{
	color: rgb(16, 87, 231);
}