@font-face {
font-family: 'Gotham Book';
font-style: normal;
font-weight: normal;
src: url('/tesla/assets/fonts/GothamBook.eot?#iefix') format('embedded-opentype'),
 url('/tesla/assets/fonts/GothamBook.woff2') format('woff2'),
 url('/tesla/assets/fonts/GothamBook.woff') format('woff'),
 url('/tesla/assets/fonts/GothamBook.ttf') format('truetype');
}
#html{
	min-height: 100%;
}
body {
	font-family: 'Gotham Book';
	background-color: #161717;
	color: #d7d7d7;
}
#container {
	width:100%;
	margin: 0 auto;
	position: relative;
}

#ld_title {
	/* margin: 0 auto 3vh auto; */
	position: relative;
	text-align: center;
	font-size: max(3.4vw, 22px);
	font-weight: bold;
	margin: 1.5vh auto 1.5vh auto;
}

#legend{
	width:95%;
	margin: 0 auto;
	position: relative;
	font-size: 1.8vw;
	display: block;
}

#cell_table, #power_stats_table {
	margin: .2vh auto;
	position: relative;
}

table{
	border: 2px solid #555;
	border-collapse: collapse;
	width: 95%;
}

td {
  border: 1px solid #555;
  font-size: 1.2vw;
  padding: .7vw;
  vertical-align: middle;
  text-align:center;
  white-space: nowrap;
}
.stats{
	min-width: 5em;
}

tr:nth-child(even) {
	background-color: #222224;
}

.separator {
	border-right-width: 2px;
}
.bottom-separator {
	border-bottom-width: 2px;
}
#grafana{
	text-align: center;
	padding-top: 25px;
}
#grafana img{
	width: 94vw;
}
.balance_highlight{
	color: red !important;
}
.min_highlight {
	color:steelblue !important;
}
.max_highlight {
	color:yellow !important;
}
iframe {
	border: 1px solid;
	width: 95%;
	height: 40vh;
	margin: 0px auto;
	display:block;
}
a {
	color: #3274d9;
	text-decoration:none;
}
a:hover {
	text-decoration:underline;
}
#bms-source {
  display: inline-block;
  width: 0.75em;
  height: 0.75em;
  border-radius: 50%;
  vertical-align: middle;
  position: absolute;
  left: 0.5em;
  top: 50%;
  transform: translateY(-50%);
}
.source-file {
  background: gray;
}
.source-ws {
  background: limegreen;
}

@media (max-width: 1024px) {
	body {
	  padding-top: 0px;
	}
	#ld_title{
	  /* font-size: max(4.5vw); */
	  font-size: clamp(.83rem, -1rem + 4vw, 2rem);
  }
  }
@media (max-width: 1280px) {
  body {
    padding-top: 0px;
  }
  #ld_title{
	/* font-size: max(4.5vw); */
	font-size: clamp(.83rem, -1rem + 4vw, 2rem);
}
}
@media (min-width: 1300px){
	#container{
		width: 1400px;
		max-width: 95%
	}
	table, iframe{
		width: 100%;
	}
	td {
		font-size: 90%;
		padding: .5%;
	}
	#ld_title{
		font-size: clamp(.84rem, -1rem + 4vw, 3rem);
	}
	#legend{
		font-size: .5vw;
	}
	#grafana img{
		width: 100%;
	}
	iframe{
		height: 30vh;
	}
}
@media screen and (min-width: 1400px) {
  #ld_title{
		font-size: 45px;
	}
}