| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144 |
- .webgl-content *,* {
- border: 0;
- margin: 0;
- padding: 0;
- }
- html,body,.webgl-content {
- width: 100%;
- height: 100%;
- }
- body{
- }
- .video{
- position: fixed;
- z-index: 999;
- top: 30px;
- left: 30px;
- }
- #fixVideo{
- width: 350px;
- display: none;
- }
- .enter{
- position: fixed;
- top: 0;
- left: 0;
- background: #000;
- width: 100%;
- height: 100%;
- }
- .enter > span{
- display: inline-block;
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%,-50%);
- color: #60ffff;
- min-width: 100px;
- border: #60ffff 1px solid;
- z-index: 999;
- }
- .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: 154px;
- height: 130px;
- }
- .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;
- }
- .webgl-content .logo.Dark {
- background-image: url("progressLogo.Dark.png");
- }
- .webgl-content .progress.Dark .empty {
- background-image: url("progressEmpty.Dark.png");
- }
- .webgl-content .progress.Dark .full {
- background-image: url("progressFull.Dark.png");
- }
- .webgl-content .footer {
- margin-top: 5px;
- height: 38px;
- line-height: 38px;
- font-family: Helvetica, Verdana, Arial, sans-serif;
- font-size: 18px;
- }
- .webgl-content .footer .webgl-logo,
- .title,
- .fullscreen {
- height: 100%;
- display: inline-block;
- background: transparent center no-repeat;
- }
- .webgl-content .footer .webgl-logo {
- background-image: url("webgl-logo.png");
- width: 204px;
- float: left;
- }
- .webgl-content .footer .title {
- margin-right: 10px;
- float: right;
- }
- .webgl-content .footer .fullscreen {
- background-image: url("fullscreen.png");
- width: 38px;
- float: right;
- }
- .welcome{
- position: fixed;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- background: rgba(0, 0, 0, 0.8);
- }
- .welcome span{
- display: inline-block;
- position: absolute;
- text-align: center;
- line-height: 40px;
- height: 40px;
- top: 50%;
- left: 50%;
- transform: translate(-50%,-50%);
- width: 100px;
- background: #d07b0e;
- color: #fff;
- border-radius: 20px;
- padding: 0 30px;
- cursor: pointer;
- }
|