body { padding: 0; margin: 0; }
.container { position: absolute; background: #222; display: flex; flex-direction: column; }
.container.unity-desktop { left: 50%; top: 50%; transform: translate(-50%, -50%) }
.container.unity-mobile { width: 100%; height: 100% }
.canvas { background: #231F20 }
.unity-mobile .canvas { width: 100%; height: 100% }
#unity-loading-bar { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none }
#unity-logo { width: 206px; height: 130px; margin: 0 auto; background: url('/config/TemplateData/y8-logo.png') no-repeat center; background-size: 206px 130px; }
#unity-progress-bar-empty { float: left; display: inline-block; width: 100%; height: 20px; margin-top: 10px; background: black }
#unity-progress-bar-full { float: left; display: inline-block; width: 0%; height: 20px; background: red }
.unity-mobile .footer { display: none }

.container .footer {
  background: #222;
  font-family: Helvetica, Verdana, Arial, sans-serif;
  height: 40px;
  line-height: 40px;
  margin: 0;
}

.container .footer .webgl-logo, .title, .fullscreen {
  background: transparent center no-repeat;
  display: inline-block;
  height: 100%;
}

.container .footer .unity,
.container .footer .webgl {
  box-sizing: border-box;
  background-position: 10px center;
  background-repeat: no-repeat;
  background-size: 46px 18px;
  height: 40px;
  float: left;
  padding: 0 10px;
  width: 66px;
}

.container .footer .unity.enable {
  background-image: url('/config/TemplateData/unity-enable.png');
}

.container .footer .unity.disable {
  background-image: url('/config/TemplateData/unity-disable.png');
}

.container .footer .webgl.enable {
  background-image: url('/config/TemplateData/webgl-enable.png');
}

.container .footer .webgl.disable {
  background-image: url('/config/TemplateData/webgl-disable.png');
}

.container .footer .fullscreen {
  background-image: url('/config/TemplateData/maximize-icon.png');
  background-position: 10px center;
  background-repeat: no-repeat;
  background-size: 16px;
  box-sizing: border-box;
  color: #fff;
  float: right;
  font-size: 12px;
  padding: 0 10px 0 36px;
  width: auto;
}
.container .footer .unity.disable:hover,
.container .footer .webgl.disable:hover,
.container .footer .fullscreen:hover {
  background-color: #3e3e3e;
  cursor: pointer;
}

h1 {
  padding: 0;
  margin: 0;
  font-size: 14px;
  color: #fff;
}