body {
  background-color: black;
  height: 100%;
  /* disable long press in iOS? */
	-webkit-touch-callout: none;
}

.bg {
  background-image: url("/images/warpspeed.gif");

  /* Full height */
  height: 100%;
  width: 100%;

  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.vl {
  border-left: 1px solid black;
  height: 50px;
}

.mainUI
{
	border: 0px solid pink;
	position: fixed;
	top: 0px;
	width:99%;
	height:99%;
	z-index: 1;
	pointer-events: none; /* allow click-through in transparent areas */
}

.regionUI
{
	border: 0px solid yellow;
	position: absolute;
	display: flex;
	flex-direction: row;
	pointer-events: none;
}

.buttonUI
{
	border: 0px solid lime;
	display: flex;
	flex-direction: column;
	justify-content: center;
	pointer-events: auto;
	filter: drop-shadow(0px 0px 20px white);
}

#buttons {
  background: rgba(255, 255, 255, 0.8);
  opacity: .5;
  position: fixed;
  bottom: 1rem;
  left: 0px;
  right: 0px;
  z-index: 100;
  /* width: 15rem; */
  width: 20rem;
  margin: auto;
  padding: .5rem;
  box-sizing: border-box;
  border-radius: 1rem;
  display: flex;
  justify-content: space-between;
  /* transition: opacity 250ms; */
}

#buttons button {
  background: none;
  border: none;
}

#mutebtn,
#emojibtn,
#chatbtn,
#announcebtn,
#embedlinkbtn,
#youtubebtn,
#googledocsbtn,
#whiteboardbtn,
#meetingroombtn,
#videomutebtn,
#swapcamerabtn,
#backtoroom,
#roomlinksbtn,
#previewbtn,
#hangupbtn,
#closedcaptioningbtn,
#screensharebtn {
  /* display: none; */
  font-size: 2rem;
  cursor: pointer;
}
#mutebtn,
#emojibtn,
#chatbtn,
#hangupbtn,
#closedcaptioningbtn,
#videomutebtn {
  display: block;
}