/* Background colors */
/*
#page{
  border: 1px solid #000 !important;
}
#header{
  background-color: #fdd;
}
#left{
  background-color: #dfd;
}
#content{
  background-color: #dff;
}
#right{
  background-color: #fdf;
}
#footer{
  background-color: #ddf;
}
*/

body{
  text-align: center;
}
#page{
  border: 0px solid #fff;
  width: 1024px;
  display: inline-block;
  text-align: left;
  margin-top: 0px;
}
#header{
  height: 80px;
  line-height: 1.5em;
  text-align: center
}
#left{
  float: left;
  width: 0px;
  height: 724px;
}
#content{
  width: 1024px;
  height: 724px;
  overflow: hidden;
}
#right{
  float: right;
  width: 0px;
  height: 724px;
}
#footer{
  height: 50px;
  text-align: center;
}

#logo{
  float: left;
  height: 80px;
  margin-right: 10px;
}

#virtual-device{
  position: relative;
  width: 852px;
  height: 724px;
  margin: 0 auto;
}
#info{
  z-index: 0;
  position: absolute;
  display: inline-block;
  width: 400px;
  height: 20px;
  right: 0px;
  top: 20px;
  text-align: right;
  color: orange;
}
#licobox{
  z-index: 0;
  position: absolute;
  display: inline-block;
  background-image: url('../img/licobox.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 425px;
  height: 319px;
  left: 0px;
  top: 400px;
}
#virtual-device img{
  position: absolute;
  max-width: 852px;
  max-height: 724px;
}
#virtual-device-system{
  z-index: 1;
}
#virtual-device-drop{
  z-index: 2;
  position: absolute;
  left: 600px;
  top: -100px;
  width: 50px;
  height: 50px;
}
#virtual-device-liquid{
  z-index: 3;
  opacity: 0.65; /* 0.40 - 0.90 */
}
#virtual-device-beaker-text{
  z-index: 4;
}
#virtual-device-ph-on{
  z-index: 5;
  display: none;
}
#virtual-device-button-on{
  z-index: 6;
  position: absolute;
  left: 60px;
  top: 399px;
  width: 37px;
  height: 28px;
  transition: background-color 0.1s;
}
#virtual-device-button-off{
  z-index: 6;
  position: absolute;
  left: 106px;
  top: 399px;
  width: 36px;
  height: 28px;
  transition: background-color 0.1s;
}
#virtual-device-button-on:hover,
#virtual-device-button-off:hover{
  background-color: rgba(0, 0, 0, 0.1);
}

#virtual-device-ph-value{
  z-index: 6;
  position: absolute;
  display: inline-block;
  width: 142px;
  height: 102px;
  left: 55px;
  top: 240px;
  font-size: 60px;
  text-align: center;
  font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
  line-height: 102px;
}