body#sjGameBody {position: fixed;top: 0;bottom: 0;left: 0;right: 0;margin: 0;}

#mainBox {position: relative;width: 100%;height: 100%;border: 0;margin: 0;padding: 0;background: url('sj_back.jpg') no-repeat center / cover;}
#mainBox #playBtn {position: absolute;top: 50%;left: 50%;width: 200px;height: auto;border: 0;margin: 20px 0 0 -100px;padding: 10px 0;background: #CDEF00;border-radius: 12px;font-weight: 900; font-size: 24px;text-align: center;color: #fff;cursor: pointer;font-family:Verdana, Geneva, sans-serif;text-shadow: 1px 1px #AAC11E;box-shadow: 0 12px 8px -10px rgba(0, 0, 0, 0.6);}
#mainBox #playBtn.disabled { opacity: 0.85; cursor: default; background: #879194;}
#mainBox #playBtn:hover:not(.disabled) {background: #AAC11E;box-shadow: 0 6px 12px -5px rgba(0, 0, 0, 0.6);}
#mainBox #mainLogo {position: absolute;bottom: 50%;left: 50%;width: 160px;height: auto;border: 0;margin: 0 0 20px -80px;padding: 0;}
#mainBox #mainFooter {position: absolute;bottom: 0;left: 50%;width: 300px;height: auto;border: 0;margin: 0 0 0 -150px;padding: 5px;background: #fff;border-radius: 6px 6px 0 0;font-weight: 400; font-size: 11px;text-align: center;color: #adadad;font-family:Verdana, Geneva, sans-serif;}
#mainBox .loader {
  display: none;
  border: 6px solid #fff;
  border-top: 6px solid #0091D0;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  animation: spin 2s linear infinite;
  position: absolute;top: 50%;left: 50%;margin: 80px 0 0 -14px;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
#mainBox .blocker {
  display: none;
  background: #fff;
  border: 1px solid #cdcdcd;
  border-radius: 12px;
  width: 260px;
  height: auto;
  padding: 20px;
  text-align: center;
  font-weight: bold;
  font-family:Verdana, Geneva, sans-serif;
  font-size: 14px;
  position: absolute;top: 50%;left: 50%;margin: 80px 0 0 -150px;
}

.webgl-content * {border: 0;margin: 0;padding: 0;}
.webgl-content {position: relative;width: 100%;height: 100%;border: 0;margin: 0;padding: 0;}

.webgl-content .logo, .progress {position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
.webgl-content .logo {background: url('progressLogo.Light.png') no-repeat center / contain; width: 300px; height: 70px;}
.webgl-content .progress {height: 18px; width: 141px; margin-top: 90px;}
.webgl-content .progress .empty {background: url('progressEmpty.Light.png') no-repeat right / cover; float: right; width: 100%; height: 100%; display: inline-block;}
.webgl-content .progress .full {background: url('progressFull.Light.png') no-repeat left / cover; float: left; width: 0%; height: 100%; display: inline-block;}