html {
     overflow: hidden;
     background-color: #444444;
     font-family: arial;
 }

 a, a:visited, a:hover {
     color: rgb(1, 1, 131);
 }
 
  #local_video {
/*     border: 1px solid; */
    height: 20%;
/*     width: 10%; */
    position: absolute;
    float: left;
    z-index:1;
    bottom: calc(3% + 60px);
    right: 3%;
    object-fit: fill;
    background-color: transparent;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
 }
 
  #received_video {
/*     border: 1px solid; */
    height: calc(100% - 60px);
    width: 100%;
    position: absolute;
    top: 0%;
    left: 0;
    float:left;
     z-index: -1;
     display:block;
    object-fit: contain;
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
 }

#icon-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #111111;
    width: 100%;
    height: 60px;
}

#icon-bar img {
    max-width: calc(65% / 6);
    padding-left: 5%;
}

#settings-container {
    visibility: hidden;
    opacity: 0;
    transition: visibility 0.5s, opacity 0.5s linear;
    position: absolute;
    top: 0;
    left: 0;
    padding: 1%;
    width: 100%;
    background-color: white;
    z-index: 99;
}

#settings-table, #settings-table select, #settings-container button{
    font-size: 17px;
}

#settings-container label {
    font-weight: bold;
}

#waiting-message,
#join-message,
#camera-disabled,
#mic-disabled,
.error-message {
    margin: auto;
    height: 100%;
    width: 100%;
    position: fixed;
}

#waiting-message table,
#join-message table,
#camera-disabled table,
.error-message table {
    margin: auto;
    font-size: 130%;
    color: white;
    height: 100%;
    text-align: center;
}

#mic-disabled table {
    margin: auto;
    font-size: 100%;
    color: white;
    z-index: 98;
    background-color: #444444;
    border-radius: 5px;
    padding: 3px;
}