.top-bar {
	flex: 1 0 auto;
}

.round-image {
	position: relative; 
	width: 50px;
	height: 50px;
	overflow: hidden;
	border-radius: 50%;
}

.round-image img {
	width: 100%;
	height: auto;
}

main {
	flex: 1 0 auto;
}

footer {
	flex-shrink:0;
	margin-left:300px;
}

.online {
	background-color: green;
}

.offline {
	background-color: grey;
}

.idle {
	background-color: orange;
}

.dot {
	height: 15px;
	width: 15px;
	border-radius:50%;
	display: inline-block;
}

.left-borders {
	-moz-border-radius: 32px 0px 0px 32px;
	-webkit-border-radius: 32px 0px 0px 32px;
	border-radius: 32px 0px 0px 32px;
	margin-left:0; !important
}

.right-borders {
	-moz-border-radius: 0px 32px 32px 0px;
	-webkit-border-radius: 0px 32px 32px 0px;
	border-radius: 0px 32px 32px 0px;
	margin-right:0; !important

}

.bottom-right-corner {
	-moz-border-radius: 32px 32px 0px 32px;
	-webkit-border-radius: 32px 32px 0px 32px;
	border-radius: 32px 32px 0px 32px;
	margin-left:0; !important
}

html, body {
	height:100%;
}

body {
	background-color: #464646;
	display:flex;
	flex-direction:column;
}

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

.xanax-stack {
	width: fit-content;
	display:flex;
	vertical-align: middle;
}

.xanax-box {
	height:20px;
	width:20px;
	border: 1px solid black;
	padding-bottom: 10px;
	/*margin-left:5px;
	margin-right:5px;*/
}

.box-legend {
	float:left;
	height:20px;
	width:20px;
	border: 1px solid black;
	margin-bottom: 2px;
}

.xanax-spaced {
/*	margin-left:1px;
	margin-right:1px;*/
}

.xanax-od {
	background-color: red;
}

.xanax-success {
	background-color: green;
}

.xanax-none {
	background-color: lightgray;
}

.xanax-personal {
	background-color: lightgreen;
}

.xanax-personal-od {
	background-color: lightsalmon;
}

/*.tooltip {
  position: relative;
  display: inline-block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  bottom: 150%;
  left: 50%;
  margin-left: -60px;
}
*/

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: -10%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}
/*
.tooltip:hover .tooltiptext {
  visibility: visible;
}
*/