.loginLogo{
	touch-action: manipulation;
	position: absolute;
    animation: loginLogoPlayX 1s steps(2) infinite,
                 loginLogoPlayY 2s steps(9) infinite;
}

/* 

#effectCanvas {
	display: block!important;
}
 */

/* 
#promo {
    background: url('//cdn.staticresourcecdn.com/h5lobby/live/common1/template1/images/promotion/promo2.jpg?v=1.0.965') center/contain no-repeat !important;
}
 */

@media screen and (orientation:landscape) {
/* 
.wrapper{
	background: url(//cdn.staticresourcecdn.com/h5lobby/staging/common1/template1/images/bg_cny.jpg) left/cover no-repeat !important;
}
 */
.loginLogo{
    top: -13%;
    left: 50%;
    width: 80vh;
    height: 17.2vh;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background: url('Images?image=logo.png') left top/160vh 154.8vh no-repeat;
}
@keyframes loginLogoPlayX {
      from {background-position-x: 0px;}
      to {background-position-x: calc(-160vh);}
    }
@keyframes loginLogoPlayY {
      from {background-position-y: 0px;}
      to {background-position-y: calc(-154.8vh);}
    }
.logoTopLeft{
	position: absolute;
	top: 48%;
	left: 43%;
	width: 30vh;
	height: 6.5vh;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	background: url('Images?image=logo.png') left top/60vh 58.5vh no-repeat;
	animation: logoPlayX 1s steps(2) infinite,
	logoPlayY 2s steps(9) infinite;
}
@keyframes logoPlayX {
	from {background-position-x: 0px;}
	to {background-position-x: -60;}
}
@keyframes logoPlayY {
	from {background-position-y: 0px;}
	to {background-position-y: -58.5vh;}
}
#annoucement{
	bottom:-2vh !important;
	left: 64% !important;
	width: calc(100% - 38vh) !important;
}

#version{
	right:1vh!important;
	top:5.5vh!important;
	font-size: 2vh!important;
}

}

@media screen and (orientation:portrait) {
/* 
.wrapper{
	background: url(//cdn.staticresourcecdn.com/h5lobby/staging/common1/template1/images/bg_cny.jpg) center/cover no-repeat !important;
}
 */
.loginLogo{
    top: -30%;
    left: 50%;
    width: 80vw;
    height: 17.1vw;
     -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, -0%);
    background: url('Images?image=logo.png') left top/160vw 153.9vw no-repeat;
}
@keyframes loginLogoPlayX {
      from {background-position-x: 0px;}
      to {background-position-x: calc(-160vw);}
    }
@keyframes loginLogoPlayY {
      from {background-position-y: 0px;}
      to {background-position-y: calc(-153.9vw);}
    }
.logo{
	position: absolute;
    top: 2vw;
    left: calc(50% - 15vw);
    width: 28vw;
    height: 6vw;
    background: url('Images?image=logo.png') left top/56vw 54vw no-repeat;
    animation: logoPlayX 1s steps(2) infinite,
                 logoPlayY 2s steps(9) infinite;
}
@keyframes logoPlayX {
      from {background-position-x: 0px;}
      to {background-position-x: -56vw;}
    }
@keyframes logoPlayY {
      from {background-position-y: 0px;}
      to {background-position-y: -54vw;}
    }
#version{
	top:7vw !important;
}

}