html,body{height:100%;}

.bg-purple {
  background: rgb(48,0,50);
}
.bg-gray {
  background: rgb(74,74,74);
}
.bg-blue {
  background: rgb(50,101,196);
}

iframe{
    border-width: 0px;
}

#connectionLost {
  align-items: center;
}

#connectionLost img {
  max-width: 64px;
  max-height: 64px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 16px;
  width: 20%;
}

#processing {
  color: royalblue;
  align-items: center;
}

#processing i {
  max-width: 64px;
  max-height: 64px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 16px;
  width: 20%;
}

#header {
  background-color: black;
  padding-top: 0.3rem;
  padding-bottom: 0.4rem;
  border-bottom-color: royalblue;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  height: 48px;
}

#navIconsRight {
  font-size: 1.4rem;
  cursor: pointer;
  text-align: right;
  color: aliceblue;
  vertical-align: bottom;
}

#navIconsRight i {
  vertical-align: bottom;
  animation-iteration-count: 1;
  animation-duration: 0.5s;
}

#navIconsLeft {
  font-size: 1.4rem;
  cursor: pointer;
  text-align: left;
  color: aliceblue;
  vertical-align: bottom;
}

#navIconsLeft i {
  vertical-align: bottom;
}

#backIcon {
  padding-left:0.2rem;
  padding-right:0.6rem;
  margin-right: 0.6rem;
}

#title{
  font-size: 1.6rem;
  text-align: center;
  font-weight: bold;      
  color: #C6D7F8;    
  color:  rgb(247,170,18);
  vertical-align: bottom;    
}