body {
	font-family: Arial;
	font-size: 9pt
}

td {
	font-family: Arial;
	font-size: 9pt
}

th {
	font-family: Arial;
	font-size: 9pt
}
tr { 
	font-family: Arial; 
	font-size: 9pt 
}
input {
	font-family: Arial; 
	font-size: 9pt;
	text-align:left;
}
	
<!-- this code for admin menu  -->

.menu {
 position:relative;
 background-color:gold;
 border:1px solid darkblue;
 width:120;
 font-size:11px;
 font-family:verdana;
 font:bold;
 position:absolute;
 cursor:se-resize;
}

.item_panel {
  width:120;
  border-left:1px solid darkblue;
  border-right:1px solid darkblue;
  clip:rect(0,120,0,0);
  position:absolute;
}

.item_panel a {
 text-decoration:none;
 color:black;
 cursor:hand;
}

.item {
 background-color:lightyellow;
 width:120;
 font-size:10px;
 font-family:verdana;
}
.my_text_medium{
	font-size: medium;
}
.my_body {
	background: #3D3D3D;
}
.my_navbar {
	background: #3D3D3D;
	overflow: hidden;
	position: fixed;
	margin-top: 0px;
	width: 100%;
	top: 0px;
	right: inherit;
}
.my_main {
  margin-top: 150px;
  text-align:center;
  height: 1500px; /* Used in this example to enable scrolling */
}


.tooltip {
  position: relative;
  display: inline-block;
   /*border-bottom: 1px dotted black; */
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 400px;
  background-color: yellow;
  color: black;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

.my_Show {
  position: relative;
  display: inline-block;
  /* border-bottom: 1px dotted black; */
}

.my_Show .my_Show_Text {
  visibility: hidden;
  width: 400px;
  background-color: yellow;
  color: black;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;

  /* Position the my_Show */
  position: absolute;
  z-index: 1;
}

.my_Show:hover .my_Show_Text {
  visibility: visible;
}


.pointer {cursor: pointer;}
.help {cursor: help;}


.my_accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
}

.active, .my_accordion:hover {
  background-color: #ccc; 
}

.my_panel {
  padding: 0 18px;
  display: none;
  background-color: white;
  overflow: hidden;
}

.my_dot {
	height: 50px;
	width: 50px;
	background-color: #bbb;
	border-radius: 50%;
	display: inline-block;
	vertical-align:central;
}

.my_dot_sm {
	height: 20px;
	width: 20px;
	background-color: #bbb;
	border-radius: 50%;
	display: inline-block;
	vertical-align:central;
}

.my_dot-content {
  color: #fff;
  float: left;
  line-height: 1;
  margin-top: -0.5em;
  padding-top: 50%;
  text-align: center;
  width: 100%;
}

.my_seat_dot {
	height: 15px;
	width: 15px;
  	background-color: #bbb;
  	border-radius: 50%;
  	display: inline-block;
  	vertical-align:central;
}
.my_seat_dot_idle {
	height: 15px;
	width: 15px;  
  	border-radius: 50%;
  	display: inline-block;
  	vertical-align:central;
}

.my_seat_plan {
	width: 768px;
	overflow:auto;
	text-align:center;			
}
.my_scene{
	width: 250px;
	height: 50px;
	vertical-align:central;	
 	border-bottom-color:darkslategray;
}
.my_border_color	{
	border-color:darkblue;
	border-width:5px;
}

.my_fa_white {
    color: white !important;
}

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: red;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#myBtn:hover {
  background-color: #555;
}