#ad-background {
	display:inline-block;
	position:absolute;
	width:100%;
	height:100%;
}
#ad-background > img {
	position:relative;
	display:block;
	min-width:360px;
}
.bgshadow {height:4.5%;}

/*Invitation Ad*/
#invitation-bg {
	background: url('inv_bg.jpg') no-repeat;
}

#inv_signals {
	position:absolute;
	width:30%;
	left:25%;
	top:0;
	
	-webkit-transform: scale(1.6);
	transform: scale(1.6);
	-webkit-transform-origin: center top;
	transform-origin: center top;
}
#inv_signals.animation1 {
	-webkit-animation: anim-signals 8s ease-out forwards;
	animation: anim-signals 8s ease-out forwards;
}
@-webkit-keyframes anim-signals {
	0%,60%{-webkit-transform:scale(1.6);top:10%;opacity:1;}
	70%,97%{-webkit-transform:scale(1);top:0;opacity:1;}
	100%{-webkit-transform:scale(1);top:0;opacity:0;}
}
@keyframes anim-signals {
	0%,60%{transform:scale(1.6);top:10%;opacity:1;}
	70%,97%{transform:scale(1);top:0;opacity:1;}
	100%{transform:scale(1);top:0;opacity:0;}
}

.signals-img {
	position:absolute;
	width:100%;
	-webkit-transform-origin: right bottom;
	transform-origin: right bottom;
}
.signals-img.animationloop {
	-webkit-animation: anim-signalsloop 8s ease-out alternate 2;
	animation: anim-signalsloop 8s ease-out alternate 2;
}
@keyframes anim-signalsloop {
	0%{-webkit-transform:rotate(-30deg) translateY(50%);}
	20%{-webkit-transform:rotate(-8deg) translateY(5%);}
	60%{-webkit-transform:rotate(30deg) translateY(20%);}
	100%{-webkit-transform:rotate(0deg) translateY(0);}
}
@keyframes anim-signalsloop {
	0%{transform:rotate(-30deg) translateY(50%);}
	20%{transform:rotate(-8deg) translateY(5%);}
	60%{transform:rotate(30deg) translateY(20%);}
	100%{transform:rotate(0deg) translateY(0);}
}

#inv_building_left {
	position:absolute;
	width:82%;
	left:-120%;
	bottom:-3%;
	
	-webkit-transform-origin: right bottom;
	transform-origin: right bottom;
}
#inv_building_left.animation1 {
	-webkit-animation: anim-buildleft 8s ease-out forwards;
	animation: anim-buildleft 8s ease-out forwards;
}
@keyframes anim-buildleft {
	0%,60%{-webkit-transform:scale(1.5);left:-120%;bottom:-70%;}
	65%,100%{-webkit-transform:scale(1);left:-18%;bottom:-3%;}
}
@keyframes anim-buildleft {
	0%,60%{transform:scale(1.5);left:-120%;bottom:-70%;}
	65%,100%{transform:scale(1);left:-18%;bottom:-3%;}
}

#inv_building_right {
	position:absolute;
	width:82%;
	left:100%;
	bottom:-3%;
	
	-webkit-transform: scale(-1.5,1.5);
	transform: scale(-1.5,1.5);
	-webkit-transform-origin: left bottom;
	transform-origin: left bottom;
}
#inv_building_right.animation1 {
	-webkit-animation: anim-buildright 8s ease-out forwards;
	animation: anim-buildright 8s ease-out forwards;
}
@keyframes anim-buildright {
	0%,60%{-webkit-transform:scale(1.5);left:100%;bottom:-70%;}
	65%,100%{-webkit-transform:scale(1);left:54%;bottom:-3%;}
}
@keyframes anim-buildright {
	0%,60%{transform:scale(1.5);left:100%;bottom:-70%;}
	65%,100%{transform:scale(1);left:54%;bottom:-3%;}
}

#inv_bridge {
	position:absolute;
	width:108.1%;
	left:-2.8%;
	bottom:-150%;
	opacity:0;

	-webkit-transform: scale(1.5);
	transform: scale(1.5);
}
#inv_bridge.animation1 {
	-webkit-animation: anim-bridge 8s ease-out forwards;
	animation: anim-bridge 8s ease-out forwards;
}
@keyframes anim-bridge {
	0%,60%{-webkit-transform:scale(1.5);bottom:-150%;opacity:0;}
	70%,100%{-webkit-transform:scale(1);bottom:-35%;opacity:1;}
}
@keyframes anim-bridge {
	0%,60%{transform:scale(1.5);bottom:-150%;opacity:0;}
	70%,100%{transform:scale(1);bottom:-35%;opacity:1;}
}

#inv_batman_wrapper {
	display:inline-block;
	position:absolute;
	width:62.5%;
	height:200%;
	left:44%;
	top:200%;
	opacity:0;
	overflow:hidden;
}
#inv_batman_wrapper.animation1 {
	-webkit-animation: anim-batman 8s ease-out forwards;
	animation: anim-batman 8s ease-out forwards;
}
@-webkit-keyframes anim-batman {
	0%,72%{top:200%;opacity:0;}
	78%{top:-5%;opacity:1;}
	82%,100%{top:0%;opacity:1;}
}
@keyframes anim-batman {
	0%,72%{top:200%;opacity:0;}
	78%{top:-5%;opacity:1;}
	82%,100%{top:0%;opacity:1;}
}
#inv_batman_wrapper > .sprite-batman {
	display:block;
	position:relative;
	margin-left:0;
	width:400%;
	height:auto;
	
	-webkit-animation: anim-batmanimg 5s steps(1, end) forwards 6.8s;
	animation: anim-batmanimg 5s steps(1, end) forwards 6.8s;
}
@-webkit-keyframes anim-batmanimg {
	0%{margin-left:0;}
	3%{margin-left:-100%;}
	4%,89%{margin-left:-200%;}
	90%,100%{margin-left:-300%;}
}
@keyframes anim-batmanimg {
	0%{margin-left:0;}
	3%{margin-left:-100%;}
	4%,61%{margin-left:-200%;}
	62%,100%{margin-left:-300%;}
}

#inv_batlogo {
	position:absolute;
	width:53.6%;
	left:9.8%;
	top:8%;
	opacity:0;
}
#inv_batlogo.animation1 {
	-webkit-animation: anim-invibatlogo 12s ease-out forwards;
	animation: anim-invibatlogo 12s ease-out forwards;
}
@-webkit-keyframes anim-invibatlogo {
	0%,72%{opacity:0;}
	75%,100%{opacity:1;}
}
@keyframes anim-invibatlogo {
	0%,72%{opacity:0;}
	75%,100%{opacity:1;}
}

#inv_date {
	position:absolute;
	width:23.9%;
	left:25.6%;
	top:200%;
	opacity:0;
}
#inv_date.animation1 {
	-webkit-animation: anim-invidate 12s ease-out forwards;
	animation: anim-invidate 12s ease-out forwards;
}
@-webkit-keyframes anim-invidate {
	0%,75%{top:200%;opacity:0;}
	78%{top:48%;opacity:1;}
	80%,100%{top:50%;opacity:1;}
}
@keyframes anim-invidate {
	0%,75%{top:200%;opacity:0;}
	78%{top:48%;opacity:1;}
	80%,100%{top:50%;opacity:1;}
}

#inv_cta {
	position:absolute;
	width:39.8%;
	left:18%;
	top:200%;
	opacity:0;
	
	-webkit-transform-origin: left top;
	transform-origin: left top;
}
#inv_cta.animation1 {
	-webkit-animation: anim-invcta 12s ease-out forwards;
	animation: anim-invcta 12s ease-out forwards;
}
@-webkit-keyframes anim-invcta {
	0%,75%{top:200%;opacity:0;}
	76%{top:46%;opacity:1;}
	77%,82%{top:48%;-webkit-transform: rotate(0deg);}
	82.5%,83.5%{-webkit-transform: rotate(10deg);}
	84%,100%{-webkit-transform: rotate(8deg);top:48%;opacity:1;}
}
@keyframes anim-invcta {
	0%,75%{top:200%;opacity:0;}
	76%{top:46%;opacity:1;}
	77%,82%{top:48%;transform: rotate(0deg);}
	82.5%,83.5%{transform: rotate(10deg);}
	84%,100%{transform: rotate(8deg);top:48%;opacity:1;}
}

/*Expanded Ad*/

img {
	/*background-size:100%;*/
}

#banner-content {
	width:320px;
	height:416px;
}

#float-top-content{
	position:absolute;
	left:0;
	width:100%;
	height:100%;
	min-width:320px;
	min-height:416px;
}

#batlogo {
	position:absolute;
	width:52.8%;
	left:22.8%;
	top:4%;
	opacity:0;
}
#batlogo.animation1 {
	-webkit-animation: anim-bounceshow 0.8s ease-out forwards;
	animation: anim-bounceshow 0.8s ease-out forwards;
}

#info_theatre {
	position:absolute;
	width:54.7%;
	left:22.7%;
	top:15.6%;
	opacity:0;
}
#info_theatre.animation1 {
	-webkit-animation: anim-bounceshow 0.8s ease-out forwards 0.5s;
	animation: anim-bounceshow 0.8s ease-out forwards 0.5s;
}

#bgvideo {
	position:absolute;
	width:69.5%;
	left:15.3%;
	top:23%;
}
#bgvideo.animation1 {
	-webkit-animation: anim-bounceshow 0.8s ease-out forwards 0.7s;
	animation: anim-bounceshow 0.8s ease-out forwards 0.7s;
}

#btn_find {
	position:absolute;
	width:33.6%;
	left:32.7%;
	bottom:5.8%;
	opacity:0;
}
#btn_find.animation1 {
	-webkit-animation: anim-bounceshow 0.8s ease-out forwards 1s;
	animation: anim-bounceshow 0.8s ease-out forwards 1s;
}
.img_find {
	margin:auto;
	width:100%;
}
@-webkit-keyframes anim-bounceshow {
	0%{-webkit-transform: scale(0.2);opacity:0;}
	20%{-webkit-transform: scale(1.2);opacity:1;}
	50%,100%{-webkit-transform: scale(1);opacity:1;}
}
@keyframes anim-bounceshow {
	0%{transform: scale(0.2);opacity:0;}
	20%{transform: scale(1.2);opacity:1;}
	50%,100%{transform: scale(1);opacity:1;}
}

#btn_blank {
	position:absolute;
	width:100%;
	height:100%;
	left: 0%;
	top: 0%;
}

#video_container {
	background-color:#fcce2d;
	position:absolute;
	width:61.4%;
	left: 19%;
	top: 24.8%;
}
#video_container:before {
	content:'';
	display:inline-block;
	padding-bottom:56.25%;
}

#video_overlay {
	display:none;
	background-color:#000;
	position:absolute;
	width:100%;
	height:100%;
	left: 0;
	top: 0;
	opacity:0;
	
	-webkit-transition:opacity 0.5s ease;
	transition:opacity 0.5s ease;
}

.enlarge-video #bgvideo {
	width:98.9%;
	left: 0.5%;
	top: 27.2%;
}
.enlarge-video #video_container {
	width:89.8%;
	left: 5.2%;
	top: 29.2%;
}
.enlarge-video #video_overlay {
	display:block;
	opacity:0.5;
}





