@font-face {
	font-family: 'Conv_DIN17EFRegular';
	src: url('../fonts/din17efregular.eot');
	src: url('../fonts/din17efregular.woff') format('woff'), url('../fonts/din17efregular.ttf') format('truetype'), url('../fonts/din17efregular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
* {
	padding:0;
	margin:0;
}
body {
	margin: 0px;
	padding: 0px;
	color:#000000;
	font-family: 'Conv_DIN17EFRegular';
	font-size:22px;
/*	overflow-x: hidden;*/
}
body *:not(input){
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
}
.container {
}
#mainGame .highlighter {
	outline: 3px solid #ffff00;
	padding: 1px;
}
.container #mainGame {
	position: relative;
	margin:0px;
	left: 50%;
	-webkit-transform: translate(-50%, 0);
	-moz-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	-o-transform: translate(-50%, 0);
	transform: translate(-50%, 0);


	width: 816px;
	height: 611px;
/*	overflow: hidden;*/
	border:#333333 solid 1px;
}
#mainGame .screen {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	display: none;
}
#mainGame .screen.active {
	display: block;
}
#screen1 {
	background:url(../images/screen1/main_bg.png) no-repeat;
	background-size:100% 100%;
}
.title_image {
	background:url(../images/screen1/title.svg) no-repeat;
	width:400px;
	height:281px;
	background-size:100% auto;
	position:absolute;
	right:0;
	left:0;
	margin:auto;
	top:50px;
	color: rgba(0,0,0,0);
}
.subtitle_image {
	/* background:url(../images/screen1/subtitle.png) no-repeat;
	background-size: 100% auto; */
	width: 308px;
    height: 57px;
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
    top: 328px;
    color: #fff;
    font-size: 39px;
    padding-left: 7px;
	text-shadow: 0px 0px 1px #000, 0px 0px 1px #000, 0px 0px 1px #000, 0px 0px 1px #000, 0px 0px 2px #000, 0px 0px 3px #000, 2px 3px 16px rgba(0,0,0,0.6);
}
.button_bg {
	background:url(../images/button_bg.png) no-repeat;
	width: 120px;
	height: 70px;
	position:absolute;
	text-decoration:none;
	text-align:center;
	right:0;
	left:0;
	top:500px;
	margin:auto;
	font-weight:bold;
}
.button_bg span {
	color:#000000;
	font-size:23px;
	position:absolute;
	top:20px;
	right:0;
	left:0;
	margin:auto;
}
.button_bg:not(.disabled):hover,.button_bg:focus {
	background-position: -120px 0;
}
.button_bg:not(.disabled):active {
	background-position: -243px 0;
}
.target-complete {
	background:url(../images/screen10/target-complete.png) no-repeat;
	background-size: 100.8% 101%;
    background-position: -3.6px -6px;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:6;
	display:none;
}
#screen2 {
/* 	background:url(../images/screen2/main-bg.png) no-repeat;
background-size:100% 100%; */
    background: url(../images/screen2/main-bg.png) no-repeat;
    background-size: 102% 111%;
    background-position: 0 -67px;
}
.pirate {
	background:url(../images/screen2/pirate.svg) no-repeat;
	background-size: 100% auto;
	width:409px;
	height:1252px;
	position:absolute;
	top:-600px;
	right:-5px;
}
.popup1 {
	background:url(../images/screen2/opoup.png) no-repeat;
	background-size: 100% 100%;
	width:531px;
	height:334px;
	position:absolute;
	left:-58px;
	top:250px;
	display: none;
}
.popup1 div {
	position:absolute;
	top: 143px;
	left: 213px;
	opacity: 0;
}
.popup1 div p {
	padding-bottom:25px;
}
.volumebtn {
	background:url(../images/volume_bg.png) no-repeat;
	width:60px;
	height:60px;
	position:absolute;
	top:140px;
	left:150px;
	color: transparent;
}
.volumebtn:not(.disabled):hover,.volumebtn:focus {
	background-position: -60px 0;
}
.volumebtn:not(.disabled):active {
	background-position: -120px 0;
}
#screen2 .button_bg {
	left:645px;
	top:517px;
}
#screen3 {
	background:url(../images/screen3/main-bg.png) no-repeat;
	background-size:100% 100%;
}
.bird {
	background:url(../images/bird.svg) no-repeat;
	width:191px;
	height:220px;
	position:absolute;
	top:-5px;
	left:-61px;
 	-webkit-animation:slide-right .3s 1 linear;
 	-moz-animation:slide-right .3s 1 linear;
 	-ms-animation:slide-right .3s 1 linear;
 	-o-animation:slide-right .3s 1 linear;
 	animation:slide-right .3s 1 linear;



}
#screen3 .specialpop{
	background-size: 94% 80%;
}
#screen3 .special_pop{
	background-size: 66% 65%;
}
#screen3 .specialpop1{
	background-size: 98% 65%;
}
#screen3 .specialpop1 .txtfadein{
	padding-top: 15px;
}
#screen3 .special_pop .txtfadein{
	padding-top: 15px;
}
 @keyframes slide-right {
	from {
		top:-5px;
		left:-200px;
	}
	to {
		top:-5px;
		left:-61px;
	}
}
.popup_speak {
	background:url(../images/popup.png) no-repeat;
	/*width:463px;*/
	/*width:63px;*/
	width:0px;
	height:150px;
	position:absolute;
	top: 3px;
	left: 115px;
	background-size:100% 100%;
	/*background-size:auto 100%;*/
	z-index:2;
	/*display: none;*/

}

.popup_speak.anim{
	-webkit-animation: slideout 0.25s linear 0.35s 1 forwards;
	-moz-animation: slideout 0.25s linear 0.35s 1 forwards;
	-o-animation: slideout 0.25s linear 0.35s 1 forwards;
	-ms-animation: slideout 0.25s linear 0.35s 1 forwards;
	animation: slideout 0.25s linear 0.35s 1 forwards;
}

.popup_speak.anim1{
	-webkit-animation: slideout1 0.25s linear 0.35s 1 forwards;
	-moz-animation: slideout1 0.25s linear 0.35s 1 forwards;
	-o-animation: slideout1 0.25s linear 0.35s 1 forwards;
	-ms-animation: slideout1 0.25s linear 0.35s 1 forwards;
	animation: slideout1 0.25s linear 0.35s 1 forwards;
}
.popup_speak.anim2{
	-webkit-animation: slideout1 0.25s linear 0.35s 1 forwards;
	-moz-animation: slideout1 0.25s linear 0.35s 1 forwards;
	-o-animation: slideout1 0.25s linear 0.35s 1 forwards;
	-ms-animation: slideout1 0.25s linear 0.35s 1 forwards;
	animation: slideout1 0.25s linear 0.35s 1 forwards;
	height: 130px;
}
.popup_speak.anim3{
	-webkit-animation: slideout1 0.25s linear 0.35s 1 forwards;
	-moz-animation: slideout1 0.25s linear 0.35s 1 forwards;
	-o-animation: slideout1 0.25s linear 0.35s 1 forwards;
	-ms-animation: slideout1 0.25s linear 0.35s 1 forwards;
	animation: slideout1 0.25s linear 0.35s 1 forwards;
	height: 100px;
}


 @-webkit-keyframes slideout1 {
	from { width:0px; }
	to { width:500px; }
}
@-o-keyframes slideout1 {
	from { width:0px; }
	to { width:500px; }
}@-ms-keyframes slideout1 {
	from { width:0px; }
	to { width:500px; }
}
@-moz-keyframes slideout1 {
	from { width:0px; }
	to { width:500px; }
}
@keyframes slideout1 {
	from { width:0px; }
	to { width:500px; }
}
 

@-webkit-keyframes slideout {
	from { width:0px; }
	to { width:463px; }
}
@-o-keyframes slideout {
	from { width:0px; }
	to { width:463px; }
}@-ms-keyframes slideout {
	from { width:0px; }
	to { width:463px; }
}
@-moz-keyframes slideout {
	from { width:0px; }
	to { width:463px; }
}
@keyframes slideout {
	from { width:0px; }
	to { width:463px; }
}

/* .popup_speak span {
	line-height:26px;
	position:absolute;
	top:16px;
	left:100px;
	opacity: 0;
	-webkit-animation: in 0.1s steps(1) 1s 1 forwards;
	-o-animation: in 0.1s steps(1) 1s 1 forwards;
	animation: in 0.1s steps(1) 1s 1 forwards;	
} */

.popup_speak div {
	line-height:26px;
	position:absolute;
    top: 13px;
    left: 95px;
	opacity: 0;
}

div.txtfadein{
	-webkit-animation: in 0.05s steps(1) 0.75s 1 forwards;
	-o-animation: in 0.05s steps(1) 0.75s 1 forwards;
	-moz-animation: in 0.05s steps(1) 0.75s 1 forwards;
	-ms-animation: in 0.05s steps(1) 0.75s 1 forwards;
	animation: in 0.05s steps(1) 0.75s 1 forwards;
}
#screen2 div.txtfadein{
	-webkit-animation: in 0s steps(1) 0.05s 1 forwards;
	-o-animation: in 0s steps(1) 0.05s 1 forwards;
	-moz-animation: in 0s steps(1) 0.05s 1 forwards;
	-ms-animation: in 0s steps(1) 0.05s 1 forwards;
	animation: in 0s steps(1) 0.05s 1 forwards;
}

.volumebtn.txtfadein{
	-webkit-animation: in1 0.05s steps(1) 0.75s 1 forwards;
	-o-animation: in1 0.05s steps(1) 0.75s 1 forwards;
	-moz-animation: in1 0.05s steps(1) 0.75s 1 forwards;
	-ms-animation: in1 0.05s steps(1) 0.75s 1 forwards;
	animation: in1 0.05s steps(1) 0.75s 1 forwards;
}
#screen2 .volumebtn.txtfadein1{
	-webkit-animation: in1 0s steps(1) 0.05s 1 forwards;
	-o-animation: in1 0s steps(1) 0.05s 1 forwards;
	-moz-animation: in1 0s steps(1) 0.05s 1 forwards;
	-ms-animation: in1 0s steps(1) 0.05s 1 forwards;
	animation: in1 0s steps(1) 0.05s 1 forwards;
}

.popup_speak div p {
	padding-bottom:25px;
}
.popup_speak div p:last-child {
	padding-bottom:0px;
}

#screen3 .popup_speak.long{
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
    width: 520px !important;
    height: 75px !important;
    background-size: 100% 100%;
}

#screen3 .popup_speak.small{
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
	width: 373px !important;
    background-size: 100% 100%;
}

/* .popup_speak span p {
	padding-bottom:25px;
} */
.popup_speak .volumebtn {
	top: 12px;
	left: 30px;
	opacity: 0;
/*	-webkit-animation: in 0.1s steps(1) 0.5s 1 forwards;
	-o-animation: in 0.1s steps(1) 0.5s 1 forwards;
	animation: in 0.1s steps(1) 0.5s 1 forwards;*/
}

@-webkit-keyframes in {
	from { opacity: 0; color: transparent; }
	to { opacity: 1; color:#000000;}
}
@-o-keyframes in {
	from { opacity: 0; color: transparent;}
	to { opacity: 1; color:#000000;}
}
@-moz-keyframes in {
	from { opacity: 0; color: transparent;}
	to { opacity: 1; color: #000000;}
}
@-ms-keyframes in {
	from { opacity: 0; color: transparent;}
	to { opacity: 1; color: #000000;}
}
@keyframes in {
	from { opacity: 0; color: transparent;}
	to { opacity: 1; color: #000000;}
}
@-webkit-keyframes in1 {
	from { opacity: 0; }
	to { opacity: 1; }
}
@-o-keyframes in1 {
	from { opacity: 0;}
	to { opacity: 1; }
}
@-moz-keyframes in1 {
	from { opacity: 0;}
	to { opacity: 1;}
}
@-ms-keyframes in1 {
	from { opacity: 0;}
	to { opacity: 1;}
}
@keyframes in1 {
	from { opacity: 0;}
	to { opacity: 1;}
}

.title_animation {
	background:url(../images/screen2/title_sprite.png) no-repeat top left;
	width: 710px;
	height: 505px;
	position: absolute;
	top: -60px;
	left: -91px;
    -webkit-animation: animate 1.5s steps(23) 1;
    -moz-animation: animate 1.5s steps(23) 1;
    -ms-animation: animate 1.5s steps(23) 1;
    -o-animation: animate 1.5s steps(23) 1;
    animation: animate 1.5s steps(23) 1;
    background-position: -15620px 0;
	-webkit-transform: scale(0.72);
	-moz-transform: scale(0.72);
	-ms-transform: scale(0.72);
	-o-transform: scale(0.72);
	transform: scale(0.72);
	z-index:3;
	color:rgba(0,0,0,0);
}
@keyframes animate {
from {
background-position:0 0;
}
to {
	background-position:-16330px 0;
}
}
#screen3 .button_bg.disabled, #screen5 .button_bg.disabled {
	background-position:-364px;
	cursor: default;
}
#screen3 .button_chk {
	left: 83px;
	top: 321px;
	right:auto;
}
#screen3 .button_clr {
	left:204px;
	top: 321px;
	right:auto;
}

#screen3 .typing{
    position: absolute;
    top: 248px;
    left: 69px;
    width: 272px;
    height: 60px;
    line-height: 57px;
    color: #FED881;
    font-size: 36px;
    text-align: center;
}

#screen3 .wordsmade1{
    position: absolute;
    top: 457px;
    left: 100px;
    width: 83px;
    height: 39px;
}

#screen3 .wordsmade2{
    position: absolute;
    top: 500px;
    left: 100px;
    width: 83px;
    height: 39px;
}

#screen3 .wordsmade3{
    position: absolute;
    top: 457px;
    left: 250px;
    width: 83px;
    height: 39px;
}

#screen3 .wordsmade4{
    position: absolute;
    top: 500px;
    left: 250px;
    width: 83px;
    height: 39px;
}

#screen3 .words{
	line-height: 59px;
}

.basket {
	background:url(../images/screen3/rope.png) no-repeat;
	width:208px;
	height:853px;
	position:absolute;
	top: -291px;
	left: 392px;
	z-index:1;
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}
.coconut {
	background:url(../images/screen3/coconut-sprite.png) no-repeat;
	width: 67px;
	height: 66px;
	position:absolute;
	text-align:center;
	cursor:pointer;
}
.coconut.hover {
	background-position:-67px 0;
}
.coconut:not(.disabled):active,.coconut.active {
	/*opacity:.7;*/
	background-position: -134px 0;
}

.coconut.disabled{
	/*opacity: 0.7;*/
	background-position: -201px 0;
}

.coconut.disabled span{
	color:rgba(253,215,128,0.3);
}

.coconut span {
	font-size:30px;
	color:#fdd780;
	font-family: 'Conv_DIN17EFRegular';
	position:absolute;
	right:0;
	left:0;
	top:12px;
	margin:auto;
}
#coconut1 {
	bottom: 124px;
	left: 65px;
	z-index:2;
}
#coconut2 {
	bottom: 142px;
	left: 25px;
	z-index:1;
}
#coconut3 {
	bottom: 142px;
	left: 110px;
	z-index:1;
}
#coconut4 {
	bottom: 88px;
	left: 6px;
}
#coconut5 {
	bottom: 80px;
	left: 59px;
	z-index:3;
}
#coconut6 {
	bottom: 91px;
	left: 134px;
	z-index:3;
}
#coconut7 {
	bottom: 50px;
	left: 102px;
	z-index:4;
}
#coconut8 {
	bottom: 27px;
	left: 7px;
	z-index:4;
}
#coconut9 {
	bottom: 0px;
	left: 64px;
	z-index:4;
}

#coconutspl {
    bottom: 50px;
    left: 103px;
}

#coconutspleft {
    bottom: 27px;
    left: 7px;
}

#coconutspcenter {
    bottom: 1px;
    left: 64px;
}

.pirate2{
	position: absolute;
    bottom: 10px;
    right: 228px;
	background: url(../images/screen3/pirate2.svg) no-repeat;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	width:206px;
	height: 311px;
	display: none;
}


#net {
	position: absolute;
/* 	top: 323px;
right: 225px; */
    bottom: 13px;
    left: 14px;

	z-index: 5;
	transform: scale(1.09, 1.08);
}
#net_design {
	position: absolute;
/* 	top: 359px;
right: 238px; */
    bottom: 13px;
    left: 14px;
	z-index: 6;
	transform: scale(1.06, 1.09);
	transform-origin: left top;
}
#net_design path {
	cursor:pointer;
}

/*start of basket animation*/

.bringdownbasket{
	-webkit-animation: upbasket 0.5s ease-in 0.3s 2 forwards;
	-o-animation: upbasket 0.5s ease-in 0.3s 2 forwards;
	-moz-animation: upbasket 0.5s ease-in 0.3s 2 forwards;
	animation: upbasket 0.5s ease-in 0.3s 2 forwards;
}

.secondbasket{
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;	
	transform: translateY(-40px);
}

.bringdown1basket{
  	-webkit-animation: up2basket 0.5s ease-in 0.3s 2 forwards;
	-o-animation: up2basket 0.5s ease-in 0.3s 2 forwards;
	-moz-animation: up2basket 0.5s ease-in 0.3s 2 forwards;
	animation: up2basket 0.5s ease-in 0.3s 2 forwards;	  
}

.bringdown2basket{
  	-webkit-animation: up3basket 0.5s ease-in 0.3s 2 forwards;
	-o-animation: up3basket 0.5s ease-in 0.3s 2 forwards;
	-moz-animation: up3basket 0.5s ease-in 0.3s 2 forwards;
	animation: up3basket 0.5s ease-in 0.3s 2 forwards;	  
}

.bringdown3basket{
  	-webkit-animation: up4basket 0.5s ease-in 0.3s 2 forwards;
	-o-animation: up4basket 0.5s ease-in 0.3s 2 forwards;
	-moz-animation: up4basket 0.5s ease-in 0.3s 2 forwards;
	animation: up4basket 0.5s ease-in 0.3s 2 forwards;	  
}

.thirdbasket{
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;	
/*  	-webkit-animation: up2 0.5s ease-in 0.3s 2 forwards;
 -o-animation: up2 0.5s ease-in 0.3s 2 forwards;
 -moz-animation: up2 0.5s ease-in 0.3s 2 forwards;
 animation: up2 0.5s ease-in 0.3s 2 forwards;	 */ 
	transform: translateY(-80px);
} 

.fourthbasket{
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;	
/*  	-webkit-animation: up2 0.5s ease-in 0.3s 2 forwards;
 -o-animation: up2 0.5s ease-in 0.3s 2 forwards;
 -moz-animation: up2 0.5s ease-in 0.3s 2 forwards;
 animation: up2 0.5s ease-in 0.3s 2 forwards;	 */ 
	transform: translateY(-120px);
} 


@-webkit-keyframes up4basket {
	0% { transform: translateY(-160px); }
	50% {transform: translateY(-165px);}
	100% { transform: translateY(-160px); }
}
@-o-keyframes up4basket {
	0% { transform: translateY(-160px); }
	50% {transform: translateY(-165px);}
	100% { transform: translateY(-160px); }
}
@-moz-keyframes up4basket {
	0% { transform: translateY(-160px); }
	50% {transform: translateY(-165px);}
	100% { transform: translateY(-160px); }
}
@keyframes up4basket {
	0% { transform: translateY(-160px); }
	50% {transform: translateY(-165px);}
	100% { transform: translateY(-160px); }
}


@-webkit-keyframes up3basket {
	0% { transform: translateY(-120px); }
	50% {transform: translateY(-125px);}
	100% { transform: translateY(-120px); }
}
@-o-keyframes up3basket {
	0% { transform: translateY(-120px); }
	50% {transform: translateY(-125px);}
	100% { transform: translateY(-120px); }
}
@-moz-keyframes up3basket {
	0% { transform: translateY(-120px); }
	50% {transform: translateY(-125px);}
	100% { transform: translateY(-120px); }
}
@keyframes up3basket {
	0% { transform: translateY(-120px); }
	50% {transform: translateY(-125px);}
	100% { transform: translateY(-120px); }
}


 
@-webkit-keyframes up2basket {
	0% { transform: translateY(-80px); }
	50% {transform: translateY(-85px);}
	100% { transform: translateY(-80px); }
}
@-o-keyframes up2basket {
	0% { transform: translateY(-80px); }
	50% {transform: translateY(-85px);}
	100% { transform: translateY(-80px); }
}
@-moz-keyframes up2basket {
	0% { transform: translateY(-80px); }
	50% {transform: translateY(-85px);}
	100% { transform: translateY(-80px); }
}
@keyframes up2basket {
	0% { transform: translateY(-80px); }
	50% {transform: translateY(-85px);}
	100% { transform: translateY(-80px); }
}
 

@-webkit-keyframes upbasket {
	0% { transform: translateY(-40px); }
	50% {transform: translateY(-45px);}
	100% { transform: translateY(-40px); }
}
@-o-keyframes upbasket {
	0% { transform: translateY(-40px); }
	50% {transform: translateY(-45px);}
	100% { transform: translateY(-40px); }
}
@-moz-keyframes upbasket {
	0% { transform: translateY(-40px); }
	50% {transform: translateY(-45px);}
	100% { transform: translateY(-40px); }
}
@keyframes upbasket {
	0% { transform: translateY(-40px); }
	50% {transform: translateY(-45px);}
	100% { transform: translateY(-40px); }
}


/*end of basket animation*/

.pirate_r {
	background:url(../images/screen3/pirate.svg) no-repeat;
	background-size: 100% auto;
	width:215px;
	height:845px;
	position:absolute;
	top: -450px;
	right: 10px;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	transform:translateY(0px);
	-webkit-transform:translateY(0px);
	-moz-transform:translateY(0px);
	z-index: 1;
}

.bringdown{
	-webkit-animation: up 0.5s ease-in 0.3s 2 forwards;
	-o-animation: up 0.5s ease-in 0.3s 2 forwards;
	-moz-animation: up 0.5s ease-in 0.3s 2 forwards;
	animation: up 0.5s ease-in 0.3s 2 forwards;
}

.second{
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;	
	transform: translateY(40px);
}

.bringdown1{
  	-webkit-animation: up2 0.5s ease-in 0.3s 2 forwards;
	-o-animation: up2 0.5s ease-in 0.3s 2 forwards;
	-moz-animation: up2 0.5s ease-in 0.3s 2 forwards;
	animation: up2 0.5s ease-in 0.3s 2 forwards;	  
}

.bringdown2{
  	-webkit-animation: up3 0.5s ease-in 0.3s 2 forwards;
	-o-animation: up3 0.5s ease-in 0.3s 2 forwards;
	-moz-animation: up3 0.5s ease-in 0.3s 2 forwards;
	animation: up3 0.5s ease-in 0.3s 2 forwards;	  
}

.bringdown3{
  	-webkit-animation: up4 0.5s ease-in 0.3s 2 forwards;
	-o-animation: up4 0.5s ease-in 0.3s 2 forwards;
	-moz-animation: up4 0.5s ease-in 0.3s 2 forwards;
	animation: up4 0.5s ease-in 0.3s 2 forwards;	  
}

.third{
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;	
/*  	-webkit-animation: up2 0.5s ease-in 0.3s 2 forwards;
 -o-animation: up2 0.5s ease-in 0.3s 2 forwards;
 -moz-animation: up2 0.5s ease-in 0.3s 2 forwards;
 animation: up2 0.5s ease-in 0.3s 2 forwards;	 */ 
	transform: translateY(80px);
} 

.fourth{
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;	
/*  	-webkit-animation: up2 0.5s ease-in 0.3s 2 forwards;
 -o-animation: up2 0.5s ease-in 0.3s 2 forwards;
 -moz-animation: up2 0.5s ease-in 0.3s 2 forwards;
 animation: up2 0.5s ease-in 0.3s 2 forwards;	 */ 
	transform: translateY(120px);
} 


@-webkit-keyframes up4 {
	0% { transform: translateY(160px); }
	50% {transform: translateY(165px);}
	100% { transform: translateY(160px); }
}
@-o-keyframes up4 {
	0% { transform: translateY(160px); }
	50% {transform: translateY(165px);}
	100% { transform: translateY(160px); }
}
@-moz-keyframes up4 {
	0% { transform: translateY(160px); }
	50% {transform: translateY(165px);}
	100% { transform: translateY(160px); }
}
@keyframes up4 {
	0% { transform: translateY(160px); }
	50% {transform: translateY(165px);}
	100% { transform: translateY(160px); }
}


@-webkit-keyframes up3 {
	0% { transform: translateY(120px); }
	50% {transform: translateY(125px);}
	100% { transform: translateY(120px); }
}
@-o-keyframes up3 {
	0% { transform: translateY(120px); }
	50% {transform: translateY(125px);}
	100% { transform: translateY(120px); }
}
@-moz-keyframes up3 {
	0% { transform: translateY(120px); }
	50% {transform: translateY(125px);}
	100% { transform: translateY(120px); }
}
@keyframes up3 {
	0% { transform: translateY(120px); }
	50% {transform: translateY(125px);}
	100% { transform: translateY(120px); }
}


 
@-webkit-keyframes up2 {
	0% { transform: translateY(80px); }
	50% {transform: translateY(85px);}
	100% { transform: translateY(80px); }
}
@-o-keyframes up2 {
	0% { transform: translateY(80px); }
	50% {transform: translateY(85px);}
	100% { transform: translateY(80px); }
}
@-moz-keyframes up2 {
	0% { transform: translateY(80px); }
	50% {transform: translateY(85px);}
	100% { transform: translateY(80px); }
}
@keyframes up2 {
	0% { transform: translateY(80px); }
	50% {transform: translateY(85px);}
	100% { transform: translateY(80px); }
}
 

@-webkit-keyframes up {
	0% { transform: translateY(40px); }
	50% {transform: translateY(45px);}
	100% { transform: translateY(40px); }
}
@-o-keyframes up {
	0% { transform: translateY(40px); }
	50% {transform: translateY(45px);}
	100% { transform: translateY(40px); }
}
@-moz-keyframes up {
	0% { transform: translateY(40px); }
	50% {transform: translateY(45px);}
	100% { transform: translateY(40px); }
}
@keyframes up {
	0% { transform: translateY(40px); }
	50% {transform: translateY(45px);}
	100% { transform: translateY(40px); }
}

.map {
	background:url(../images/screen3/map.png) no-repeat top left;
	background-size: 100% auto;
	width: 198px;
	height: 95px;
	position:absolute;
	top: 515px;
	right: 15px;
	opacity:.8;
	transform:scale(1.1);
	cursor:pointer;
}
.map.disabled{
	background:url(../images/screen3/map-disable.svg) no-repeat top left;
	background-size: 100% auto;
	cursor: default;
}
.map:not(.disabled){
	/*background-position: 50% 0%;*/
/* 	-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s; */
	-webkit-transition: transform 0.5s;
	-o-transition: transform 0.5s;
	-moz-transition: transform 0.5s;
	transition: transform 0.5s;
	transform: scale(0);
	background-position:  33% 0%;
}

.map:not(.disabled):hover,.map:not(.disabled):focus{
	background:url(../images/screen3/map-hover.png) no-repeat top left;
	background-size: 100% auto;
}

.map:not(.disabled):active{
	/*missing*/
	background:url(../images/screen3/map-active.png) no-repeat top left;
	background-size: 100% auto;
}

#screen4 {
	background:url(../images/screen4/main-bg.png) no-repeat;
	background-size:100% 100%;
}
.map_bg {
	background:url(../images/screen4/map-bg.png) no-repeat;
	width: 813px;
	height: 615px;
	position: absolute;
	top: 3px;
	left: 0;
	background-size: 100% 100%;
}
.pirate_s {
	background:url(../images/screen3/pirate2.png) no-repeat;
	width:220px;
	height:312px;
	position:absolute;
	background-size:100% auto;
	top: 280px;
	left: 379px;
	z-index: 8;
}
#screen4 .bird, #screen5 .bird, #screen6 .bird, #screen7 .bird, #screen8 .bird, #screen9 .bird, #screen10 .bird, #screen11 .bird, #screen12 .bird, #screen13 .bird, #screen14 .bird, #screen15 .bird {
	z-index:6;
	animation:none;
}
#screen4 .bird{
	z-index: 7;
}

#screen4 .map_item.disabled{
	cursor: default;
}
#screen6 .bird{
	z-index: 101;
}
#screen4 .popup_speak {
	height:93px;
	/*width:470px;*/
	top: 10px;
	left: 111px;
	width:470px;
	background-size: 100% 100%;
	z-index: 101;
	display: none;
}
.flag {
	background:url(../images/screen4/flags.png) no-repeat top left;
	width: 51px;
	height: 53px;
	position:absolute;
	-webkit-animation:swing .8s steps(14) infinite;
	-moz-animation:swing .8s steps(14) infinite;
	-o-animation:swing .8s steps(14) infinite;
	-ms-animation:swing .8s steps(14) infinite;
	z-index:11;
	display: none;
	padding-left: 1px;
}
.flag1 {
      top: 118px;
    left: 286px;
}
.flag2 {
    top: 274px;
    left: 381px;
    z-index: 10002;
}
.flag3 {
    top: 198px;
    left: 423px;
}
.flag4 {
    top: 277px;
    left:598px;
}
.flag5 {
    top: 135px;
    left: 417px;
}
.flag6 {
	/* top: 376px;
    left: 526px; */
	top: 350px;
    left: 526px;
    z-index: 2;
}

@-webkit-keyframes swing {
from {
background-position:0 0;
}
to {
	background-position:-756px 0;
}
}
@-moz-keyframes swing {
from {
background-position:0 0;
}
to {
	background-position:-756px 0;
}
}
@-o-keyframes swing {
from {
background-position:0 0;
}
to {
	background-position:-756px 0;
}
}
@-ms-keyframes swing {
from {
background-position:0 0;
}
to {
	background-position:-756px 0;
}
}
.ship_area {
	background:url(../images/screen4/ship_sprite.png) no-repeat top left;
	width: 116px;
	height: 103px;
	position:absolute;
    top: 102px;
    left: 159px;
	cursor:pointer;
	z-index: 10;
}
.ship_area:not(.disabled):hover,.ship_area:focus {
	background-position: -117px 0;
	transform:scale(1.1);
}
.ship_area:not(.disabled):active {
	background-position: -234px 0;
	transform:scale(1);
}
.ship_area.disabled{
	cursor: default;
}

.sleep_area {
	background:url(../images/screen4/sleep_sprite.png) no-repeat top left;
	width: 144px;
	height: 104px;
	position:absolute;
    top: 265px;
    left: 473px;
    transform: scale(0.8);
	cursor:pointer;
	z-index: 10;
}
.sleep_area:not(.disabled):hover,.sleep_area:focus {
	background-position: -144px 0;
}
.sleep_area:not(.disabled):active {
	background-position: -288px 0;
}
.flood_area {
	background:url(../images/screen4/flood_sprite.png) no-repeat top left;
	width: 168px;
	height: 74px;
	position:absolute;
	top: 160px;
    left: 300px;
	transform:scale(0.8);
	cursor:pointer;
	z-index: 10;
}
.flood_area:not(.disabled):hover,.flood_area:focus {
	background-position: -170px 0;
	transform:scale(0.9);
}
.flood_area:not(.disabled):active {
	background-position: -340px 0;
	transform:scale(0.8);
}
.cave_area {
	background:url(../images/screen4/cave_sprite.png) no-repeat top left;
	width: 139px;
	height: 71px;
	background-position: -278px 0;
	position:absolute;
	top: 219px;
	left: 348px;
	transform:scale(0.8);
	cursor:pointer;
	z-index: 10;
}
.cave_area:not(.disabled):hover,.cave_area:focus {
	background-position: 0 0;
	transform:scale(1);
}
.cave_area:not(.disabled):active {
	background-position: -139px 0;
	transform:scale(0.8);
}
.canon_area {
	background:url(../images/screen4/canon_sprite.png) no-repeat top left;
	width:117px;
	height:76px;
	position:absolute;
	top: 259px;
    left: 261px;
	cursor:pointer;
	z-index: 10;
}
.canon_area:not(.disabled):hover,.canon_area:focus {
	background-position:-117px 0;
	transform:scale(1.1);
}
.canon_area:not(.disabled):active {
	background-position:-234px 0;
}
.stone_area {
	background:url(../images/screen4/stone_area.png) no-repeat top left;
	width: 125px;
	height:80px;
	position:absolute;
    top: 358px;
    left: 413px;
	cursor:pointer;
	z-index: 10;
}

.stone_areasvg{    width: 125px;
    height: 80px;
    position: absolute;
    top: 367px;
    left: 413px;
    cursor: pointer;
    opacity: 0;
    z-index: 12;
    cursor: pointer;
}

.stone_area[data-locked="false"] {
	background: url(../images/screen4/a0002.png) no-repeat top left;
    background-position: 0 0;
    width: 130px;
    height: 86px;
    top: 355px;
    left: 404px;
    -webkit-transform: scale(0.81) !important;
    -moz-transform: scale(0.81) !important;
    -ms-transform: scale(0.81) !important;
    -o-transform: scale(0.81) !important;
    transform: scale(0.81) !important;
}
.stone_area[data-locked="false"].hover{
	left: 401px;
	
	background-position: -130px 0 !important;
	
	-webkit-transform: scale(0.87) !important;
    -moz-transform: scale(0.87) !important;
    -ms-transform: scale(0.87) !important;
    -o-transform: scale(0.87) !important;
    transform: scale(0.87) !important;
}
.stone_area[data-locked="false"]:active{
	background-position: -260px 0 !important;
}

.stone_area[data-locked="completed"] {
	background:url(../images/screen4/a0003.png) no-repeat top left;
}


.stone_area:not(.disabled).hover, .stone_area:focus {
	background-position:-125px 0;
	transform:scale(1.1);
}
.stone_area:not(.disabled).active {
	background-position:-250px 0;
	transform:scale(1);
}
.treasure_area {
	background:url(../images/screen4/treasure-area.png) no-repeat top left;
	width: 156px;
	height: 92px;
	position:absolute;
     top: 319px;
    left: 248px;

	cursor:pointer;
	z-index: 10;
}
.treasuresvg{
	width: 156px;
    height: 95px;
    position: absolute;
    top: 319px;
    left: 246px;
    cursor: pointer;
    z-index: 12;
    opacity: 0;
}
.treasure_area:not(.disabled).hover,.treasure_area:focus {
	transform:scale(1.1);
	background-position: -156px 0;
}
.treasure_area:not(.disabled).active {
	transform:scale(1);
	background-position: -312px 0;
}
.matchesbox {
	background:url(../images/screen4/matchbox.svg) no-repeat;
	width:83px;
	height:91px;
	position:absolute;
	top: 100px;
	right: 27px;
	-webkit-transform: scale(0);
	-ms-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	transform: scale(0);
	/*display: none;
	transform: scale(0) rotate(-15deg);*/
    -webkit-transition: all 0.5s;	
    -ms-transition: all 0.5s;	
    -moz-transition: all 0.5s;	
    -o-transition: all 0.5s;	
    transition: all 0.5s;	
    z-index: 100;
}

.matchesbox.animated{
	-webkit-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-o-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-moz-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-ms-animation: scaleinout1 0.8s linear 0s 1 forwards;
	animation: scaleinout1 0.8s linear 0s 1 forwards;
	/*transform: scale(1) rotate(-15deg);*/
}
.keys {
	background:url(../images/screen4/keys.svg) no-repeat;
	width:92px;
	height:100px;
	position:absolute;
	top: 202px;
	right: 34px;
	/*display: none;*/
	-webkit-transform: scale(0);
	-ms-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	transform: scale(0);
    -webkit-transition: all 0.5s;	
    -moz-transition: all 0.5s;	
    -ms-transition: all 0.5s;	
    -o-transition: all 0.5s;	
    transition: all 0.5s;	
    z-index: 100;
}

.keys.animated{
	-webkit-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-o-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-moz-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-ms-animation: scaleinout1 0.8s linear 0s 1 forwards;
	animation: scaleinout1 0.8s linear 0s 1 forwards;
	/*transform: scale(1) rotate(-15deg);*/
}

.mapround {
	background:url(../images/screen4/map.svg) no-repeat;
	width:100px;
	height:106px;
	position:absolute;
	top: 307px;
	right: 34px;
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-ms-transform: scale(0);
	-o-transform: scale(0);
	transform: scale(0);
	/*display: none;
	transform: scale(0) rotate(-15deg);*/
    -webkit-transition: all 0.5s;	
    -moz-transition: all 0.5s;	
    -ms-transition: all 0.5s;	
    -o-transition: all 0.5s;	
    transition: all 0.5s;	
    z-index: 100;
}

.mapround.animated{
	-webkit-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-o-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-moz-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-ms-animation: scaleinout1 0.8s linear 0s 1 forwards;
	animation: scaleinout1 0.8s linear 0s 1 forwards;
	/*transform: scale(1) rotate(-15deg);*/
}
.lantern {
	background:url(../images/screen4/lantern.svg) no-repeat;
	width:86px;
	height:95px;
	position:absolute;
	top: 420px;
	right: 34px;
	-webkit-transform: scale(0);
	-ms-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	transform: scale(0);
	/*display: none;
	transform: scale(0) rotate(-15deg);*/
    -webkit-transition: all 0.5s;	
    -ms-transition: all 0.5s;	
    -moz-transition: all 0.5s;	
    -o-transition: all 0.5s;	
    transition: all 0.5s;	
    z-index: 100;
}

.lantern.animated{
	-webkit-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-o-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-moz-animation: scaleinout1 0.8s linear 0s 1 forwards;
	-ms-animation: scaleinout1 0.8s linear 0s 1 forwards;
	animation: scaleinout1 0.8s linear 0s 1 forwards;
	/*transform: scale(1) rotate(-15deg);*/
}

@-webkit-keyframes scaleinout1 {
	0% {  transform: scale(0) rotate(0deg);}
	25% { transform: scale(1.2) rotate(0deg); }
	50% {transform: scale(1) rotate(0deg);}
	75% { transform: scale(1.2) rotate(0deg); }
	100% {transform: scale(1) rotate(0deg);}	
}
@-o-keyframes scaleinout1 {
	0% {  transform: scale(0) rotate(0deg);}
	25% { transform: scale(1.2) rotate(0deg); }
	50% {transform: scale(1) rotate(0deg);}
	75% { transform: scale(1.2) rotate(0deg); }
	100% {transform: scale(1) rotate(0deg);}
}
@-moz-keyframes scaleinout1 {
	0% {  transform: scale(0) rotate(0deg);}
	25% { transform: scale(1.2) rotate(0deg); }
	50% {transform: scale(1) rotate(0deg);}
	75% { transform: scale(1.2) rotate(0deg); }
	100% {transform: scale(1) rotate(0deg);}	
}
@keyframes scaleinout1 {
	0% {  transform: scale(0) rotate(0deg);}
	25% { transform: scale(1.2) rotate(0deg); }
	50% {transform: scale(1) rotate(0deg);}
	75% { transform: scale(1.2) rotate(0deg); }
	100% {transform: scale(1) rotate(0deg);}	
}

#screen5 {
	background:url(../images/screen5/main_bg.png) no-repeat;
	background-size:100% auto;
}

#screen5 .bird{
z-index: 101;
}

#screen5 .popup_speak{
	width: 0px;
	/*height: 177px; */
	z-index:6;
	overflow: hidden;
	padding-bottom: 20px;	
	z-index: 101;
}

#screen5 .specialpop{
	background-size: 84% 70%;
}
#screen5 .specialpop_1{
	background-size: 84% 70%;
    height: 110px;
    max-width: 375px;
}
#screen5 .specialpop_1 .txtfadein{
	padding-top: 12px;
}
#screen5 .word
{
	/*display: none;*/
	-webkit-transform: scale(0) rotate(-15deg);
	-moz-transform: scale(0) rotate(-15deg);
	-ms-transform: scale(0) rotate(-15deg);
	-o-transform: scale(0) rotate(-15deg);
	transform: scale(0) rotate(-15deg);
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

#screen5 .selectbtn.disabled{
   background-position: 0 -329px;
}

#screen5 .word.animated{
	-webkit-animation: scaleinout 0.8s linear 0s 1 forwards;
	-o-animation: scaleinout 0.8s linear 0s 1 forwards;
	-ms-animation: scaleinout 0.8s linear 0s 1 forwards;
	-moz-animation: scaleinout 0.8s linear 0s 1 forwards;
	animation: scaleinout 0.8s linear 0s 1 forwards;
	/*transform: scale(1) rotate(-15deg);*/
}

@-webkit-keyframes scaleinout {
	0% {  transform: scale(0) rotate(-15deg);}
	25% { transform: scale(1.2) rotate(-15deg); }
	50% {transform: scale(1) rotate(-15deg);}
	75% { transform: scale(1.2) rotate(-15deg); }
	100% {transform: scale(1) rotate(-15deg);}	
}
@-o-keyframes scaleinout {
	0% { transform: scale(0) rotate(-15deg); }
	25% { transform: scale(1.2) rotate(-15deg); }
	50% {transform: scale(1) rotate(-15deg);}
	75% { transform: scale(1.2) rotate(-15deg); }
	100% {transform: scale(1) rotate(-15deg);}	
}
@-moz-keyframes scaleinout {
	0% {  transform: scale(0) rotate(-15deg);}
	25% { transform: scale(1.2) rotate(-15deg); }
	50% {transform: scale(1) rotate(-15deg);}
	75% { transform: scale(1.2) rotate(-15deg); }
	100% {transform: scale(1) rotate(-15deg);}	
}
@-ms-keyframes scaleinout {
	0% {  transform: scale(0) rotate(-15deg);}
	25% { transform: scale(1.2) rotate(-15deg); }
	50% {transform: scale(1) rotate(-15deg);}
	75% { transform: scale(1.2) rotate(-15deg); }
	100% {transform: scale(1) rotate(-15deg);}	
}
@keyframes scaleinout {
	0% {  transform: scale(0) rotate(-15deg);}
	25% { transform: scale(1.2) rotate(-15deg); }
	50% {transform: scale(1) rotate(-15deg);}
	75% { transform: scale(1.2) rotate(-15deg); }
	100% {transform: scale(1) rotate(-15deg);}	
}

#screen5 .button_bg {
	background-position:0px;
}

#screen5 .button_bg.disabled{
	background-position: -363px;
}

#screen5 .button_bg:not(.disabled):hover,#screen5 .button_bg:not(.disabled):focus {
	background-position:-121px;
}

#screen5 .button_bg:not(.disabled):active {
	background-position:-243px;
}

#screen5 .popup{
	z-index: 100;
	background-repeat: repeat-x;
	display: none;
}

#screen5 .overlay{
    background: rgba(255, 255, 255, 0.5);
    z-index: 102;
}

#screen5 .overlay.black{
    background: rgba(0, 0, 0, 0.7);
    z-index: 100;
}

#screen5 .overlay1.darkblack{
	position:absolute;
	width:100%;
	height:100%;	
    background: rgba(0, 0, 0, 1);
    z-index: 100;
    display: none;
}

/*new add css*/
#screen5.error{background:url(../images/screen5/main_bg2.png) no-repeat;
	background-size:100% auto;}
#screen5.error .overlay, #screen5.error .word_bg, #screen5.error .word, #screen5.error .aknoeledgementbtn{ display:none;}
#screen5.error .popup_speak{    
	/*width: 446px;*/
    height: 100px;
	    background-size: 89% 99%;
}
#screen5.error .boat{    top: -287px;left: 95px; background:url(../images/screen5/boat2.png) no-repeat; background-size:100% auto;}
#screen5.error .water{ top:312px;}
#screen5.error .water2{ top:278px;}
#screen5.error .water3{ top:245px;}
#screen5.error .rope{    top: 180px;
    right: -193px; height:445px;}
#screen5.error .bottom_bg{    bottom: -45px;     background-size: 116% auto;}
#screen5.error .pirate_error{background:url(../images/screen5/pirate-error.png) no-repeat; width:340px; height:426px; position:absolute;     top: 120px;
    left: 223px; z-index:5;}


.bottom_bg {
	background:url(../images/screen5/bottom_bg.png) no-repeat;
	width:100%;
	position:absolute;
	bottom:-88px;
	left:0;
	height:330px;
	background-size:100% auto;
	z-index:5;
}
/*#screen5 .popup_speak, */
#screen8.popup_speak, #screen7 .popup_speak, #screen9 .popup_speak, #screen11 .popup, #screen6 .popup_speak, #screen7 .popup_speak, #screen9 .popup_speak, #screen11 .popup_speak {
	/*width: 500px;*/
	width: 0px;
	/*height: 177px; */
	z-index:6;
	overflow: hidden;
	padding-bottom: 20px;
}
#screen6 .popup_speak{
	z-index: 12;	
}
#screen6 .specialpop{
	background-size: 90% 60%;
}
#screen6 .popup_speak.locked{
	background-size: 100% 85%;
}
#screen6 .specialpop1{
	background-size: 100% 75%;
}
#screen6 .specialpop3{
	background-size: 90% 85%;
}
#screen6 .specialpop_1{
    background-size: 85% 52%;
}
#screen6 .specialpop_1 .txtfadein{
	padding-top: 12px;
}
#screen6 .specialpop_2{
    background-size: 100% 100%;
}
#screen6 .dropstone7{
    background: url(../images/screen6/stone7.png) no-repeat top left;
    top: 151px;
    /*left: 557px;*/
    left:546px;
    width: 91px;
    height: 195px;
    position: absolute;	
    opacity: 0;
}

#screen6 .dropstone5{
    background: url(../images/screen6/stone5.png) no-repeat top left;
    width: 139px;
    height: 114px;
    position: absolute;
    top: 336px;
    /*left: 529px;*/
    left:519px;
    opacity: 0;	
}

#screen6 .dropstone4{
    background: url(../images/screen6/stone4.png) no-repeat top left;	
	/*top: 323px;*/
    /*left: 449px;*/
    left: 440px;
    top: 325px;
    width: 96px;
    height: 119px;    
    position: absolute;
    opacity: 0;	    
}

#screen6 .dropstone1 {
    background: url(../images/screen6/stone1.png) no-repeat top left;
    width: 64px;
    height: 132px;
    position: absolute;
    top: 176px;
    /*left: 509px;*/
        left: 499px;
    opacity: 0;    
}

#screen6 .dropstone2 {
    background: url(../images/screen6/stone2.png) no-repeat;
    width: 102px;
    height: 127px;
    position: absolute;
    top: 286px;
    /*left: 510px;*/
    left:500px;
    opacity: 0;
}

#screen6 .dropstone3 {
    background: url(../images/screen6/stone3.png) no-repeat top left;
    width: 67px;
    height: 117px;
    position: absolute;
    top: 232px;    
    /*left: 470px;*/
    left: 460px;
    opacity: 0;
}

#screen6 .dropstone6 {
    background: url(../images/screen6/stone6.png) no-repeat top left;
    width: 62px;
    height: 54px;
    position: absolute;
    top: 317px;    
    /*left: 586px;*/
    left:573px;
    opacity: 0;
}

#screen6 .overlay1.darkblack{
	position:absolute;
	width:100%;
	height:100%;	
    background: rgba(0, 0, 0, 1);
    z-index: 100;
    display: none;
}


#screen6 .dropstone1.trans,#screen6 .dropstone2.trans,#screen6 .dropstone3.trans,#screen6 .dropstone4.trans,#screen6 .dropstone5.trans,#screen6 .dropstone6.trans,#screen6 .dropstone7.trans{
	opacity:0.5;
}

#screen6 .pirate-run{	background:url(../images/screen6/run-bg.png) no-repeat; position:absolute; width:100%; height:100%; position:absolute; top:0; left:0; background-size:100% auto; z-index:11; display:none;}
#screen6 .pirate-run .popup_speak { 
/*    width: 470px;
    height: 118px;*/
	overflow: hidden;
	padding-bottom: 20px;
}
#screen6 .gate{background:url(../images/screen6/cave.png) no-repeat;    width: 501px;
    height: 389px;
    position: absolute;
    top: 60px;
    left: 323px;
    background-size: 100% 100%;}
#screen6 .beer{background:url(../images/screen6/beer.png) no-repeat; width: 263px; height: 189px; position:absolute;     top: 250px;
    left: 417px;  background-position: 0 0;}
#screen6 .beer.eyeopen{
	background-position: -263px 0;
}

	.puzzle{background:url(../images/screen6/puzzle.png) no-repeat;     width: 220px;
    height: 303px;
    position: absolute;
    top: 152px;
    left: 439px;
    background-size: 100% 100%;
    transform: scale(0.95);
    display: none;
	}

.water {
	background:url(../images/screen5/water_sprite.png) no-repeat top left;
	width: 1086px;
	height: 135px;
	position:absolute;
	top:350px;
	left:-50px;
	-webkit-animation:flow 3s steps(79) infinite;
	-moz-animation:flow 3s steps(79) infinite;
	-ms-animation:flow 3s steps(79) infinite;
	-o-animation:flow 3s steps(79) infinite;
	animation:flow 3s steps(79) infinite;
	z-index:4;
}
@keyframes flow {
from {
background-position:0 0;
}
to {
	background-position:0 -10665px;
}
}
.water2 {
	background:url(../images/screen5/water_sprite2.png) no-repeat top left;
	width: 1086px;
	height: 135px;
	position:absolute;
	left:-50px;
	top:305px;
	-webkit-animation:flow2 3s steps(78) infinite;
	-moz-animation:flow2 3s steps(78) infinite;
	-ms-animation:flow2 3s steps(78) infinite;
	-o-animation:flow2 3s steps(78) infinite;
	animation:flow2 3s steps(78) infinite;
	background-position:0 -10530px;
	z-index:2;
}
 @keyframes flow2 {
from {
background-position:0 -10530px;
}
to {
	background-position:0 0;
}
}
.water3 {
	background:url(../images/screen5/water_sprite3.png) no-repeat top left;
	width: 1086px;
	height: 135px;
	position:absolute;
	left: -185px;
	top: 265px;
	-webkit-animation:flow 3s steps(79) infinite;
	-moz-animation:flow 3s steps(79) infinite;
	-ms-animation:flow 3s steps(79) infinite;
	-o-animation:flow 3s steps(79) infinite;
	animation:flow 3s steps(79) infinite;
}
.word_bg {
	background:url(../images/screen5/button_bg.png) no-repeat;
	width:400px;
	height:383px;
	position:absolute;
	top: 140px;
	left: -5px;
	z-index:5;
}
.selectbtn {
	background:url(../images/screen5/selectbtn_bg.png) no-repeat top left;
	width: 174px;
	height: 61px;
	position:absolute;
	cursor:pointer;
}
.selectbtn span {
	position:absolute;
	left:40px;
	font-size:24px;
	top:14px;
}

#screen5 .selectbtn span {
		    width: 101px;
    text-align: center;
    left: 15px;
}

.selectbtn.selectbtn4 span {
	/*left:24px;*/
	left: 15px;
	width: 101px;
    text-align: center;
}
.selectbtn:not(.disabled):hover,.selectbtn.focused {
	background-position: 0 -66px; 
}
.selectbtn:not(.disabled):active {
	background-position: 0 -198px; 
}
.selectbtn1 {
	top:70px;
	left:34px;
}
.selectbtn2 {
	top:70px;
	left:204px;
}
.selectbtn3 {
	top:138px;
	left:34px;
}
.selectbtn4 {
	top:138px;
	left:204px;
}
.selectbtn5 {
	top:205px;
	left:125px;
}
.selectbtn .volumebtn {
	top: 1px;
	left: 107px;
	transform:scale(0.8);
}
#screen5 .button_bg.button_chk {
	top: 271px;
	left:77px;
	right:auto;
}
#screen5 .button_bg.button_clr {
	top: 271px;
	left:211px;
	right:auto;
}
.boat {
/*	background:url(../images/screen5/boat.png) no-repeat;
	width: 779px;
	height: 733px;
	position: absolute;
	background-size: 100% auto;
	top: -250px;
	left: 3px;
	z-index:3;*/
	background: url(../images/screen5/boat.png) no-repeat;
    width: 779px;
    height: 733px;
    position: absolute;
    background-size: 95% auto;
    top: -230px;
    left: 60px;
    z-index: 3;
}
.rope {
	background:url(../images/screen5/rope.png) no-repeat;
	width: 460px;
	height: 400px;
	background-size: 100% auto;
	position: absolute;
/*	top: 222px;
	right: -95px;*/
	    top: 223px;
    right: -122px;
	z-index:5;
}
.word {
	background:url(../images/screen5/selectbtn_bg.png) no-repeat;
	width:174px;
	height:61px;
	position:absolute;
	background-position: 0 -198px; 
	text-align:center;
	transform:rotate(-15deg);
}
.word span {
	position:absolute;
	font-size:22px;
	right:0;
	left:0;
	margin:auto;
	top:15px;
}
.word1 {
	bottom: 32px;
	left: 96px;
}
.word2 {
	bottom: 99px;
	left: 74px;
}
.word3 {
	bottom: 168px;
	left: 49px;
}
.word4 {
	bottom: 238px;
	left: 24px;
}
.word5 {
	bottom: 300px;
	left: 1px;
}
.map_button {
	background:url(../images/map_button.png) no-repeat top left;
	width: 219px;
	height: 78px;
	position:absolute;
	bottom:5px;
	left:5px;
	cursor:pointer;
	color:#000000;
	z-index:6;
}
#screen6 .map_button{
	z-index: 12;
}
.map_button span {
	position: absolute;
	font-size: 22px;
	top: 24px;
	right: 38px;
	font-weight: bold;
}
.map_button:hover,.map_button:focus {
	background-position: -220px 0;
}
.map_button:active {
	background-position: -440px 0;
}
.aknoeledgementbtn {
	background:url(../images/aknoedelgement_bg.png) no-repeat top left;
	width: 145px;
	height: 49px;
	position:absolute;
	bottom: 10px;
	left: 224px;
	font-family:Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	font-size:12px;
	text-align:center;
	line-height:49px;
	text-decoration:none;
	z-index:5;
}
.aknoeledgementbtn span {
	text-decoration:underline;
}
.aknoeledgementbtn:not(.disabled):hover,.aknoeledgementbtn:focus {
	color:#6fdc0f;
}
.aknoeledgementbtn:not(.disabled):hover .font1,.aknoeledgementbtn:not(.disabled):focus .font1 {
	transform:scale(1.08);
	display:block;
}
.aknoeledgementbtn:not(.disabled):active .font1 {
	transform:scale(1);
	display:block;
}
.aknoeledgementbtn:not(.disabled):active {
	color:#000000;
}
.popup {
	background:url(../images/popup_bg.png);
	height:178px;
	width:375px;
	position:absolute;
	border-radius:10px;
	border:#000000 solid 2px;
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	left:0;
	margin:auto;
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;
	color:#FFFFFF;
	line-height:21px;
	padding:15px;
	box-sizing:border-box;
}
.popup p {
	padding-bottom:15px;
}
.close_bt {
	background:url(../images/close_bt.png) no-repeat;
	width: 36px;
	height: 36px;
	position:absolute;
	top:5px;
	right:5px;
}
.close_bt:hover {
	background-position: -36px 0;
}
.close_bt:active {
	background-position: -72px 0;
}
.heading {
	font-size:18px;
}
.overlay {
	position:absolute;
	width:100%;
	height:100%;
	background:rgba(0, 0, 0, .7);
	z-index:6;
	display: none;
}
#screen6 .overlay {
	position:absolute;
	width:100%;
	height:100%;
	z-index:12;
	background: url(../images/screen6/blac_img.png) no-repeat;
	background-size: 100%;
	/*display: none;*/
	display: block;
}
.pirate_found {
	background:url(../images/image-bg.png) no-repeat;
	width:560px;
	height:480px;
	position:absolute;
	background-size:100% auto;
	left:190px;
	/*z-index:7;*/
	top:110px;
	display: none;
	z-index: 101;
}


.pirate_found .map_button {
	bottom: 27px;
	left: 91px;
	display: none;	
}
.pirate_found .product {
	background:url(../images/screen5/lantern_image.png) no-repeat;
	width:310px;
	height:318px;
	position:absolute;
	left:43px;
	top:47px;
	background-size:100% auto;
}
#screen6 {
	background:url(../images/screen6/main-bg.png) no-repeat;
	background-size:100% 100%;
}


/* screen 10 */
#screen6 .popup{
	display: none;
	z-index: 110;
}
/* .removeWhiteBg{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(250,250,250,0.5);
    z-index: 12;
} */

.stone1 {
	background:url(../images/screen6/stone1.png) no-repeat top left;
	width: 64px;
	height: 132px;
	position:absolute;
	top: 205px;
	left: 187px;
	cursor:pointer;
}
#stone1 {
	position: absolute;
	top: 363px;
	left: 178px;
	transform: scale(.75);
}
.stone1:not(.ui-state-disabled):hover, .stone1:not(.ui-state-disabled).focused {
	background-position: -64px 0;
	transform:scale(1.1);
}
.stone1:not(.ui-state-disabled):active {
	background-position: -128px 0;
}
.stone2 {
	background:url(../images/screen6/stone2.png) no-repeat;
	width: 102px;
	height: 127px;
	position:absolute;
	top: 218px;
	left: 260px;
	cursor:pointer;
}
.stone2:not(.ui-state-disabled):hover, .stone2:not(.ui-state-disabled).focused {
	background-position: -102px 0;
	transform:scale(1.1);
}
.stone2:not(.ui-state-disabled):active {
	background-position: -204px 0;
}
.stone3 {
	background:url(../images/screen6/stone3.png) no-repeat top left;
	width: 67px;
	height: 117px;
	position:absolute;
	top: 255px;
	left: 365px;
	cursor:pointer;
}
.stone3:not(.ui-state-disabled):hover, .stone3:not(.ui-state-disabled).focused {
	background-position: -69px 0;
	transform:scale(1.1);
}
.stone3:not(.ui-state-disabled):active {
	background-position: -138px 0;
}
.stone4 {
	background:url(../images/screen6/stone4.png) no-repeat;
	width: 102px;
	height: 119px;
	position:absolute;
	top: 270px;
	left: 440px;
	cursor:pointer;
}
.stone4:not(.ui-state-disabled):hover, .stone4:not(.ui-state-disabled).focused {
	background-position: -100px 0;
	transform:scale(1.1);
}
.stone4:not(.ui-state-disabled):active {
	background-position: -201px 0;
}
.stone5 {
	background:url(../images/screen6/stone5.png) no-repeat top left;
	width: 139px;
	height: 114px;
	position:absolute;
	top: 280px;
	left: 560px;
	cursor:pointer;
}
.stone5:not(.ui-state-disabled):hover, .stone5:not(.ui-state-disabled).focused {
	background-position: -139px 0;
	transform:scale(1.1);
}
.stone5:not(.ui-state-disabled):active {
	background-position: -278px 0;
}
.stone6 {
	background:url(../images/screen6/stone6.png) no-repeat top left;
	width: 62px;
	height: 54px;
	position:absolute;
	top: 275px;
	left: 534px;
	cursor:pointer;
}
.stone6:not(.ui-state-disabled):hover, .stone6:not(.ui-state-disabled).focused {
	background-position: -62px 0;
	transform:scale(1.1);
}
.stone6:not(.ui-state-disabled):active {
	background-position: -124px 0;
}
.stone7 {
	background:url(../images/screen6/stone7.png) no-repeat top left;
	width: 91px;
	height: 195px;
	position:absolute;
	top: 180px;
	left: 709px;
	cursor:pointer;
}
.stone7:not(.ui-state-disabled):hover, .stone7:not(.ui-state-disabled).focused {
	background-position: -91px 0;
	transform:scale(1.1);
}
.stone7:not(.ui-state-disabled):active {
	background-position: -182px 0;
}
.map_r {
	background:url(../images/screen6/map.png) no-repeat;
	width:53px;
	height:123px;
	position:absolute;
	top: 327px;
	right: 115px;
}
#screen6 .pirate_found .product {
	background:url(../images/screen6/raft_plan.png) no-repeat;
	background-size:100% auto;
}
#screen7 {
	background:url( ../images/screen7/main-bg2.png) no-repeat;
	background-size:100% 100%;
}

.water-animation {
	background:url(../images/screen7/water_sprite.png) no-repeat;
	width: 1500px;
	height: 256px;
	position:absolute;
	top: 84px;
	left: -227px;
	-webkit-animation:flow3 3s steps(79) infinite;
	-moz-animation:flow3 3s steps(79) infinite;
	-ms-animation:flow3 3s steps(79) infinite;
	-o-animation:flow3 3s steps(79) infinite;
	animation:flow3 3s steps(79) infinite;	
}

#screen7.error .water-animation {
    top: 155px;
    left: -123px;
    transform: scale(1.3);
}

#screen7.error .water-animation2 {
    top: 390px;
    left: 87px;
    transform: scale(1.3);
}

 @keyframes flow3 {
 from {
background-position:0 0;
}
to {
	background-position:0 -20224px;
}
}
.water-animation2 {
	background:url(../images/screen7/water_sprite2.png) no-repeat;
	width: 855px;
	height: 368px;
	position:absolute;
	-webkit-animation:flow4 3s steps(80) infinite;
	-moz-animation:flow4 3s steps(80) infinite;
	-ms-animation:flow4 3s steps(80) infinite;
	-o-animation:flow4 3s steps(80) infinite;
	animation:flow4 3s steps(80) infinite;
	top: 252px;
	left: -31px;
}
 @-webkit-keyframes flow4 {
	from {
	background-position:0 0;
	}
	to {
		background-position:0 -29440px;
	}
}@-moz-keyframes flow4 {
	from {
	background-position:0 0;
	}
	to {
		background-position:0 -29440px;
	}
}@-o-keyframes flow4 {
	from {
	background-position:0 0;
	}
	to {
		background-position:0 -29440px;
	}
}@keyframes flow4 {
	from {
	background-position:0 0;
	}
	to {
		background-position:0 -29440px;
	}
}
.tree {
	background:url(../images/screen7/tree2.png) no-repeat;
	width: 971px;
	z-index:1;
	height: 685px;
	position: absolute;
	background-size: 100% 100%;
	top: -28px;
	left: -49px;
}
img.palm_tree {
    position: absolute;
    top: 394px;
    left: 500px;
    width: 80px;
    height: 67px;
    z-index: 10;
}
img.palm_tree1 {
    position: absolute;
    top: 359px;
    left: 373px;
    width: 78px;
    height: 67px;
    z-index: 10;
}
img.palm_tree2 {
    position: absolute;
    top: 364px;
    left: 308px;
    width: 67px;
    height: 67px;
    z-index: 10;
}

.hand {
	background:url(../images/screen7/hand.png) no-repeat;
	width:544px;
	height:457px;
	position:absolute;
	background-size:100% auto;
	top: 257px;
	left: -26px;
	z-index:2;
}
.pin {
	background:url(../images/screen7/watch-pin.png) no-repeat;
	width: 10px;
    background-size: 100% 100%;
    height: 45px;
    position: absolute;
    top: 128px;
    left: 216px;
    transition: all 0.5s;
    transform-origin: bottom center;
    -moz-transform-origin: bottom center;
    -webkit-transform-origin: bottom center;
    transform: rotate(60deg);
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
}
.arrow {
	background:url(../images/screen7/arrow.png) no-repeat top left;
	width: 80px;
	height: 70px;
	position:absolute;
	cursor:pointer;
	z-index:3;
}
.arrow:hover,.arrow:focus {
	background-position: -80px 0;
}
.arrow:active {
	background-position: -160px 0;
}


#screen5 .popup{
	z-index: 103;
	background-repeat: repeat-x;
	display: none;
}

#screen5 .overlay{
    background: rgba(255, 255, 255, 0.5);
    z-index: 102;
}

#screen5 .overlay.black, #screen6 .overlay.black{
    background: rgba(0, 0, 0, 0.7);
    z-index: 100;
}

#screen5 .overlay1.darkblack{
	position:absolute;
	width:100%;
	height:100%;	
    background: rgba(0, 0, 0, 1);
    z-index: 100;
    display: none;
}

.arrow1 {
	top: 336px;
	left: 25px;
	-webkit-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-moz-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	transform: rotate(-90deg);
	color:transparent;
}
.arrow2 {
	top:425px;
	left: 25px;
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg);
	color:transparent;
}
#screen7 .button_bg {
	top: 534px;
	left: 664px;
	z-index:2;
}
#screen7 .volumebtn.moov {
	top: 439px;
	left: 739px;
	z-index: 2;
	transform: scale(1.25);
}

#screen7.error {
    background: url(../images/screen7/blue-bg.png) no-repeat;
    background-size: 123% auto;
}

#screen7.error .hand, #screen7.error .tree, #screen7.error .arrow, #screen7.error .aknoeledgementbtn, #screen7.error .board, #screen7.error .volumebtn.moov, #screen7.error .button_bg {
	display:none;
}

#screen7.error .pirate_back {
    background: url(../images/screen7/pirate.png) no-repeat;
    width: 235px;
    height: 470px;
    position: absolute;
    top: 240px;
    left: 305px;
    background-size: 100% auto;

}
#screen7.error .water-animation {
	top: 155px;
	left: -123px;
	transform: scale(1.3);
}
#screen7.error .water-animation2 {
	top: 390px;
	left: 87px;
	transform: scale(1.3);
}
#screen7.error .popup_speak {
	width: 440px;
	height: 100px;
}


#screen7 .popup{
	z-index: 100;
	background-repeat: repeat-x;
	display: none;
}

#screen7 .overlay{
    background: rgba(255, 255, 255, 0.5);
    z-index: 100;
}

#screen7 .overlay.black{
    background: rgba(0, 0, 0, 0.7);
    z-index: 100;
}

#screen7 .overlay1.darkblack{
	position:absolute;
	width:100%;
	height:100%;	
    background: rgba(0, 0, 0, 1);
    z-index: 100;
    display: none;
}



.board {
	background:url(../images/screen7/board.png) no-repeat;
	width:275px;
	height:151px;
	position:absolute;
	top: 436px;
	left: 518px;
}
.board span {
	color: #e4d3b1;
	font-size: 26px;
	position: absolute;
	font-weight: normal;
	top: 15px;
	left: 22px;
}
#screen8, #screen9 {
	background:url( ../images/screen8/main-bg.png) no-repeat;
	background-size:100% 100%;
}

#screen8 .volumebtn{
	-webkit-animation: in 0.1s steps(1) 10s 1 forwards;
	-moz-animation: in 0.1s steps(1) 10s 1 forwards;
	-ms-animation: in 0.1s steps(1) 10s 1 forwards;
	-o-animation: in 0.1s steps(1) 10s 1 forwards;
	animation: in 0.1s steps(1) 10s 1 forwards;
	text-decoration:none;
}

#screen8 span.volvol {
    color: transparent;
    }

#screen7 .specialpop_1{
	background-size: 90% 49%;
}
#screen7 .specialpop_2{
	background-size: 97% 88%;
}
#screen8 video{
	position: absolute;
    top: -3px;
    left: -3px;
    width: 101%;
    height: 101%;
}

#screen8 .bottom_back{
	    background: url(../images/screen8/bottom-bg.png) no-repeat;
    width: 765px;
    height: 12px;
    background-size: 100% auto;
    position: absolute;
    left: 262px;
    bottom: -1px;
}
#screen8 .water-animation3 {
    background: url(../images/screen8/water-sprite.png) no-repeat;
    width: 1500px;
    height: 150px;
    position: absolute;
    top: 74px;
    left: -227px;
    animation: flow3 3.5s steps(79) infinite;
    -webkit-animation: flow3 3.5s steps(79) infinite;
    -moz-animation: flow3 3.5s steps(79) infinite;
    opacity: 0;
    transition: all 0.5s;
}

#screen8 .tree_bg{
    background: url(../images/screen8/tree3.png) no-repeat;
    width: 1310px;
    height: 930px;
    background-size: 100% auto;
    position: absolute;
    top: -325px;
    left: -319px;
    z-index: 1;
}
#screen8 .chkbtn.disabled{
	 background-position: -631px;
}
#screen8 .chkbtn:not(.disabled):hover,#screen8 .chkbtn:not(.disabled):focus {
	background-position: -211px 0;
}
#screen8 .chkbtn:not(.disabled):active {
	background-position: -422px 0;
}
.water-animation3 {
	background:url(../images/screen8/water-sprite.png) no-repeat;
	width: 1500px;
	height: 256px;
	position:absolute;
	top: 74px;
	left: -227px;
	-webkit-animation:flow3 3s steps(79) infinite;
	-moz-animation:flow3 3s steps(79) infinite;
	-ms-animation:flow3 3s steps(79) infinite;
	-o-animation:flow3 3s steps(79) infinite;
	animation:flow3 3s steps(79) infinite;
}
.bottom_back {
	background:url(../images/screen8/bottom-bg.png) no-repeat;
	width: 818px;
	height: 383px;
	background-size: 100% auto;
	position: absolute;
	left: 0;
	bottom: -15px;
}
.tree_bg {
	background:url(../images/screen8/tree3.png) no-repeat;
	width: 1249px;
	height: 930px;
	background-size: 100% auto;
	position: absolute;
	top: -290px;
	left: -274px;
	z-index:1;
}
.chkbtn {
	background:url(../images/screen8/bt-bg.png) no-repeat;
	width: 211px;
	height: 75px;
	color:#000000;
	position:absolute;
	top: 520px;
	left: 594px;
	text-align:center;
	text-decoration:none;
	z-index:2;
}
#screen15 .chkbtn{
	top: 526px;
    left: 596px;
}
.chkbtn span {
	position:absolute;
	top:22px;
	left:0;
	right:0;
	margin:auto;
	font-weight:bold;
}
.chkbtn:hover {
	background-position: -211px 0;
}
.chkbtn:active {
	background-position: -422px 0;
}
.sleeping_pirate {
	background:url(../images/screen8/sleeping-pirates.png) no-repeat top left;
	width: 273px;
	height: 200px;
	position: absolute;
	transform: scale(2.1);
	top: 187px;
	left: 231px;
	-webkit-animation:sleep 6s steps(135) infinite;
	-moz-animation:sleep 6s steps(135) infinite;
	-ms-animation:sleep 6s steps(135) infinite;
	-o-animation:sleep 6s steps(135) infinite;
	animation:sleep 6s steps(135) infinite;
	
}
 @-webkit-keyframes sleep {
	from {
	background-position:0 0;
	}
	to {
		background-position:0 -27000px;
	}
}@-moz-keyframes sleep {
	from {
	background-position:0 0;
	}
	to {
		background-position:0 -27000px;
	}
}@-o-keyframes sleep {
	from {
	background-position:0 0;
	}
	to {
		background-position:0 -27000px;
	}
}@keyframes sleep {
	from {
	background-position:0 0;
	}
	to {
		background-position:0 -27000px;
	}
}

#screen8 .aknoeledgementbtn{
    background: url(../images/aknoedelgement_bg.png) no-repeat top left;
    width: 145px;
    height: 49px;
    position: absolute;
    bottom: 4px;
    left: 210px;
    font-family: Arial, Helvetica, sans-serif;
    /*color: #FFFFFF;*/
    font-size: 12px;
    text-align: center;
    line-height: 49px;
    text-decoration: none;
    z-index: 5;
}

#screen8 .chkbtn{
	background: url(../images/screen8/bt-bg.png) no-repeat;
    width: 211px;
    height: 75px;
    color: #000000;
    position: absolute;
    top: 524px;
    left: 604px;
    text-align: center;
    text-decoration: none;
    z-index: 2;
}

#screen8 .popup_speak, #screen9 .popup_speak {
	/*width: 505px;*/
	height: 117px;
}
#screen9 .specialpop{
	background-size: 94% 86%;
}
.bottles {
	background:url(../images/screen8/bottle.png) no-repeat top left;
	width: 670px;
	height: 421px;
	position: absolute;
	background-size: 100% auto;
	top: 316px;
	left: 97px;
}
.pirate_l {
	background:url(../images/screen8/pirate.png) no-repeat top left;
	width:265px;
	height:528px;
	position: absolute;
	background-size: 100% auto;
	top: 316px;
	left:40px;
}
#screen9 .pirate_found .product {
	background:url(../images/screen9/matchbox.png) no-repeat top left;
	background-size:100% auto;
}
#screen10 {
	background:url(../images/screen10/main-bg.png) no-repeat;
	background-size:100% 100%;
}
#screen10 .popup_speak {
	/*width: 486px;
	height: 176px;*/
	overflow: hidden;
    padding-bottom: 20px;
}
.weight_tick {
	background: url(../images/screen10/weight_sui.png) no-repeat;
    background-size: 100% auto;
    width: 10px;
    height: 35px;
    position: absolute;
    top: 193px;
    left: 139px;
    -webkit-transition: 0.2s;
    -moz-transition: 0.2s;
    -ms-transition: 0.2s;
    -o-transition: 0.2s;
    transition: 0.2s;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: center bottom;
    -moz-transform-origin: center bottom;
    -ms-transform-origin: center bottom;
    -o-transform-origin: center bottom;
    transform-origin: center bottom;
}

/* .weight_tick {
	background:url(../images/screen10/weight_sui.png) no-repeat;
	width:11px;
	height:39px;
	position:absolute;
	top: 194px;
	left: 139px;
} */
.measure_plate {
    background: url(../images/screen10/measure-plate.png) no-repeat;
    width: 180px;
    height: 164px;
    position: absolute;
    background-size: 100% auto;
    top: 220px;
    left: 53px;
    background-position: bottom;
    transition: transform 0.4s;
}


.boxcontainer{
	position: absolute;
	width:100%;
	height: 430px;
	bottom: 0;
}
#screen13 .boxcontainer {
    position: absolute;
    width: 100%;
    height: 470px;
    bottom: 0;
}
.canon {
	background:url(../images/screen10/canon.png) no-repeat;
	width:345px;
	height:333px;
	position:absolute;
	top: 119px;
	left: 299px;
	z-index:2;
}
.binocular {
	background:url(../images/screen10/telescope.png) no-repeat;
	width: 244px;
	height: 278px;
	position:absolute;
	top: 160px;
	left: 560px;
	cursor:pointer;
	z-index: 1;
}
.binocular.disabled{
	cursor: default;
}
.binocular:not(.disabled):hover, .binocular:focus {
	background-position: -244px 0;
	transform:scale(1.1);
}
.binocular:not(.disabled):active {
	background-position: -488px 0;
}
#screen10 .button_bg {
	left: 685px;
	top: 535px;
	background-position:-360px 0;
}

.droppablebox {
    width: 80px;
    height: 97px;
    top: 100px;
    position: absolute;
    text-align: center;
}

.dropbox1 {
    width: 160px;
    height: 120px;
    top: 270px;
    left: 60px;
}

.box {
	background:url(../images/screen10/gunpowder_sprite.png) no-repeat top left;
	width: 80px;
	height: 97px;
	position:absolute;
	cursor:pointer;
	text-align:center;
}
.box:hover, .box:focus {
	background-position: -80px 0;
	transform:scale(1.08);
}
.box:active {
	background-position: -160px 0;
}
.box1 {
	/*top: 440px;*/
	top: 259px;
	left: 168px;
}
.box2 {
	/*top: 454px;*/
	top: 273px;
	left: 247px;
}
.box3 {
	/*top: 406px;*/
	top:225px;
	left: 306px;
}
.box4 {
	/*top: 459px;*/
	top:278px;
	left: 367px;
}
.box5 {
	/*top: 489px;*/
	top:308px;
	left: 450px;
}
.box span {
	position:absolute;
	top:50px;
	left:0;
	right:0;
	margin:auto;
	font-size:24px;
	color: #000;
}
.target {
	background:url(../images/screen10/target.png) no-repeat;
	background-size:100% 100%;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index: 7;
	display: none;
}
.digit {
	position:absolute;
	top: 266px;
	left: 428px;
}
.target .chkbtn {
	top: 530px;
	left: 601px;
}

#screen11 {
	background:url(../images/screen11/main-bg.png) no-repeat;
	background-size:100% 100%;
}

#screen11 #raft-wood .wood:hover{
	stroke:#0099FF;
}

.skeleton{
    position: absolute;
    right: 42px;
    top: 91px;
    z-index: 1;
}
.skeleton img{
	width: 225px;
}
.trees {
	background:url(../images/screen11/tree.png) no-repeat;
	background-size:100% auto;
	position:absolute;
	width:817px;
	height:865px;
	top: -25px;
	left: 0;
	z-index: 1;
}
.button_bg.disable {
	background-position:-360px 0;
	left: 680px;
	top: 536px;
	cursor:default;
}

.drum {
	background:url(../images/screen11/drum.png) no-repeat top left;
	width: 111px;
	height: 129px;
	position:absolute;
	top: 142px;
	left: 24px;
	cursor:pointer;
	z-index:6;
}

.drum.set{
	background:url(../images/screen11/drum.png) no-repeat top left;
	width: 111px;
	height: 129px;
	position:absolute;
	top: 342px;
	left: 454px;
	cursor:pointer;
	z-index:6;	
}

.drum-svg{
	position:absolute;
	top: 142px;
	left: 23px;
	cursor:pointer;
	z-index:8;
}

.drum-svg.set{
	/*background:url(../images/screen11/drum.png) no-repeat top left;*/
	width: 111px;
	height: 129px;
	position:absolute;
	top: 342px;
	left: 454px;
	cursor:pointer;
	z-index:8;
}

.drum:hover,.drum.hover,.drum:focus {
	background-position: -111px 0;
	transform:scale(1.1);
}

.drum:active,.drum.active {
	background-position: -222px 0;
	transform:scale(1);
}

.raft-woodsvg {
 	position:absolute;
	top: 198px;
	left: 28px;

    width: 337px;
    height: 170px;

	cursor:pointer; 
}

.raft-wood {
/* 	position:absolute;
top: 198px;
left: 28px;
cursor:pointer; */

    background: url(../images/screen11/raft.png) no-repeat top left;
    width: 337px;
    height: 170px;
    position: absolute;
    top: 198px;
    left: 28px;
    cursor: pointer;

}
  .raft-wood.hover,.raft-wood:focus {
	background-position: -337px 0;
	transform:scale(1.08);
}  

/* .raft-woodsvg path{
	opacity: 0;
}

.stand1 svg path{
	opacity: 0;
}

.stand2 svg path{
	opacity: 0;
}

.drum-svg path{
	opacity:0;
} */



#raft-wood .wood:hover{
    stroke: red;
    stroke-width: 5px;
}
.raft-wood:active {
	background-position: -674px 0;
	transform:scale(1);
}

.raft-wood.active {
	background-position: -674px 0;
	transform:scale(1);
}

.raft-woodsvg.set{
    width: 338px;
    height: 167px;
    position: absolute;
    top: 351px;
    left: 439px;
    cursor: pointer;	
}

.raft-wood.set{
    background: url(../images/screen11/base.png) no-repeat top left;
    width: 330px;
    height: 167px;
    position: absolute;
    top: 342px;
    left: 434px;
    cursor: pointer;
    /*background-position: -328px 0px;*/
    background-size: auto 100%;
}

.raft-wood.set.hover{
    background: url(../images/screen11/base.png) no-repeat top left;
    width: 330px;
    height: 167px;
    position: absolute;
    top: 342px;
    left: 434px;
    cursor: pointer;
    background-position: -328px 0px;
    background-size: auto 100%;
}

.raft-wood.set path{
	opacity: 1;
}




/* .stand1 svg path{

} */

/* .hover{
	
} */

.raft-curtain {
	background:url(../images/screen11/raft_curtain.png) no-repeat top left;
	width: 107px;
	height: 71px;
	position:absolute;
	top: 298px;
	left: 277px;
	cursor:pointer;
}
.raft-curtain-svg {
	position:absolute;
	top: 298px;
	left: 277px;
	cursor:pointer;
}
.raft-curtain.hover,.raft-curtain:focus {
	background-position: -108px 0;
	transform:scale(1.08);
}
.raft-curtain.active {
	background-position: -216px 0;
	transform:scale(1);
}
.raft-flag {
	background:url(../images/screen11/raft-flag.png) no-repeat top left;
	width: 60px;
	height: 51px;
	position:absolute;
	top: 324px;
	left: 223px;
	cursor:pointer;
}
.raft-flag-svg {
	position:absolute;
	top: 325px;
	left: 223px;
	cursor:pointer;
}
.raft-flag.hover,.raft-flag:focus {
	background-position: -60px 0;
	transform:scale(1.1);
}
.raft-flag.active {
	background-position: -120px 0;
	transform:scale(1);
}
.clothes {
	background:url(../images/screen11/clothes.png) no-repeat top left;
	width: 103px;
	height: 74px;
	position:absolute;
	top: 369px;
	left: 257px;
	cursor:pointer;
}
.clothes-svg{
	position:absolute;
	top: 366px;
    left: 256px;
	cursor:pointer;
}
.clothes.hover,.clothes:focus {
	background-position: -103px 0;
	transform:scale(1.1);
}
.clothes.active {
	background-position: -206px 0;
	transform:scale(1);
}
.arrow-flag {
	background:url(../images/screen11/arrow.png) no-repeat top left;
	width: 52px;
	height: 44px;
	position:absolute;
	top: 369px;
	left: 11px;
	cursor:pointer;
}
.arrowflag-svg {
	position:absolute;
	top: 369px;
	left: 11px;
	cursor:pointer;
}
.arrow-flag.hover,.arrow-flag:focus {
	background-position: -52px 0;
	transform:scale(1.1);
}
.arrow-flag.active {
	background-position: -104px 0;
	transform:scale(1);
}

.stand1{
	background:url(../images/screen11/raftstick.png) no-repeat top left;
    width: 166px;
    height: 224px;
	z-index: 1;
    position: absolute;
	bottom: 31px;
    left: 35px;
}
.stand1-svg{
	    z-index: 1;
    position: absolute;
    bottom: 72px;
    left: 28px;
}
/* .stand1:hover {
	background-position: -163px 0;
	transform:scale(1.1);
} */

.stand1-svg.set{
    background: url(../images/raft/img12.svg) no-repeat top left;
    width: 178px;
    height: 190px;
    position: absolute;
    bottom: 72px;
    left: 549px;
    cursor: pointer;
}

.stand1.hover,.stand1:focus {
	background-position: -163px 0;
	transform:scale(1.1);
}
.stand1.active {
	background-position: -331px 0;
	transform:scale(1.1);
}
.stand2{
	background:url(../images/screen11/raftback.png) no-repeat top left;
    width: 223px;
    height: 224px;
    z-index: 1;
    position: absolute;
    bottom: -1px;
    left: 66px;
}
.stand2-svg{
	    z-index: 1;
    position: absolute;
    bottom: -6px;
    left: 61px;
}
.stand2.hover,.stand2:focus {
	background-position: -224px 0;
	transform:scale(1.1);
}
.stand2.active {
	background-position: -452px 0;
	transform:scale(1.1);
}
#screen11 .popup_speak{
	height: 160px !important;
}

#screen11 .mapbg {
	background:url(../images/screen11/mapbg.png) no-repeat top left;
	width:223px;
	height:92px;
	position:absolute;
	top: 506px;
	left: 345px;
	cursor:pointer;
	z-index: 10;
}
#screen11 .mapbg .map_s:hover, #screen11 .mapbg .map_s:focus {
	background-position: -157px 0;
	transform:scale(1.1);
}
#screen11 .mapbg .map_s:active {
	background-position: -314px 0;
	transform:scale(1);
}
#screen11 .map_s {
	background:url(../images/screen11/map.png) no-repeat top left;
	width: 157px;
	height: 102px;
	position:absolute;
	top: -16px;
	left: 34px;
	cursor:pointer;
}
.raftdesign {
	background:url(../images/screen11/raft-design.png) no-repeat top left;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-size:100% auto;
	z-index:11;
	display: none;
}
#screen11 .raftdesign .popup_speak {
	/*width:470px;*/
	height: 87px;
}
#screen11 .raftdesign .popup_speak.specialpop{
    background-size: 79% 51%;
}

#screen11 .raftdesign .popup_speak.specialpop .txtfadein{
	 padding-top: 13px;
}
#screen11 .raftdesign .button_bg {
	left: 680px;
	top: 536px;
}

#screen11 .raftstick1 {
    background: url(../images/screen11/raftstick1.png) no-repeat;
    width: 219px;
    height: 261px;
    position: absolute;
    top: 170px;
    left: 487px;
    cursor: pointer;
    z-index: 1;
}

#screen11.error svg{
	display: none;
}
#screen11 .tools{
	z-index: 1;
}
#screen11.error .tools{
	display: none;
}
#screen11 svg.point path{
	cursor: default;
}
#screen11 #boatvid{
	display: none;
	z-index: 102;
	position: absolute;
	top: 0;
	left: 0;
}
#screen11 #boatvid + .map_button{
    bottom: 46px;
    left: 300px;
    z-index: 103;
    display: none;
}
#screen11 .popup_speak.specialpop_3{
	background-size: 96% 85%;
}
#screen11 .popup_speak.specialpop{
	background-size: 95% 49%;
}
#screen11 .popup_speak.specialpop1{
	background-size: 60% 49%;
}
#screen11 .popup_speak.specialpop_2{
	background-size: 90% 70%;
}
#screen11 .popup_speak.specialpop .txtfadein, #screen11 .popup_speak.specialpop1 .txtfadein{
	padding-top: 15px;
}
#screen11 .raft-back1.wrong{
	background-position: -640px 0;
}
#screen11 .drum-sprite.wrong{
	background-position: -654px 0;
}
#screen11 .arrowflag.wrong{
	background-position: -186px 0;
}
#screen11 .clothesopen.wrong{
	background-position: -602px 0;
}
#screen11 .raft-wood.correct{
	background-position: -1013px 0;
}
#screen11 .raft-curtain.correct{
	background-position: -324px 0;
}
#screen11 .raft-flag.correct{
	background-position: -180px 0;
}
#screen11 .stand1.correct{
	background-position: -498px 0;
}

#screen12 {
	background:url(../images/screen12/main-bg.png) no-repeat;
	background-size:100% auto;
}
#screen12 .popup_speak {
	/*width:470px;
	height:177px;*/
	overflow: hidden;
	padding-bottom: 20px;
	z-index:6;
}
#screen13 {
	background:url(../images/screen13/main-bg.png) no-repeat;
	background-size:100% auto;
}
#screen13 .popup_speak {
	/*width:465px;*/
	height:177px;
	z-index:6;
}

#screen13 .button_bg{
	    background-position: 0px 0;
    left: 664px;
    top: 536px;
    z-index: 313;
}
#screen13 .button_bg.disabled{
	background-position: -363px 0;
	cursor: default;
}
#para1{
	background-color:red;
}

.statustone1 {
	background:url(../images/screen13/stone1.png) no-repeat;
	width: 102px;
	height: 136px;
	position:absolute;
	top: 105px;
	left: 71px;
	cursor:pointer;
	opacity:1;

}





.dropstone1 {
	background:url(../images/screen13/stone1.png) no-repeat;
	background-position: 18px 12px;
	width: 120px;
	height: 140px;
	position:relative;
	top: 125px;
	left: 533px;
	z-index:114;
	opacity:0;
	}

.dropstone2 {
	background:url(../images/screen13/stone3.png) no-repeat;
	background-position: 18px 12px;
	width: 120px;
	height: 124px;
	position:relative;
	top: 102px;
	left: 533px;
	z-index:112;
	opacity:0;	
}

.dropstone3 {
	background:url(../images/screen13/stone2.png) no-repeat;
	background-position: 18px 12px;
	width: 126px;
	height: 124px;
	position:relative;
    top: 74px;
	left: 531px;
	z-index:110;
	opacity:0;
	/*border: 1px solid red;*/
}

.dropstone4 {
	background:url(../images/screen13/stone4.png) no-repeat;
	background-position: 18px 12px;
    width: 126px;
    height: 137px;
	position: relative;
    top: 34px;
	left: 532px;
	z-index:108;
	opacity: 0;
}

.fixed{
	opacity:1;
}

.bounce{
	
	-webkit-animation: bounce 0.8s linear 0s 1 forwards;
	-moz-animation: bounce 0.8s linear 0s 1 forwards;
	-ms-animation: bounce 0.8s linear 0s 1 forwards;
	-o-animation: bounce 0.8s linear 0s 1 forwards;
	animation: bounce 0.8s linear 0s 1 forwards;
	/*transform: scale(1) rotate(-15deg);*/
}

.statustone1:not(.disabled):hover, .statustone1:not(.disabled):focus {
	background-position: -104px 0;
	transform:scale(1.1);
}
.statustone1:not(.disabled):active {
	background-position: -208px 0;
	transform:scale(1);
}
.statustone3 {
	background:url(../images/screen13/stone2.png) no-repeat;
	width: 107px;
	height: 114px;
	position:absolute;
	top: 110px;
	left: 207px;
	cursor:pointer;
	/*opacity:1;*/
}
.statustone3:not(.disabled):hover, .statustone3:not(.disabled):focus {
	background-position: -108px 0;
	transform:scale(1.1);
}
.statustone3:not(.disabled):active {
	background-position: -216px 0;
	transform:scale(1);
}
.statustone2 {
	background:url(../images/screen13/stone3.png) no-repeat;
	width: 105px;
	height: 115px;
	position:absolute;
	top: 235px;
	left: 230px;
	cursor:pointer;
		/*//opacity:1,*/

}
.statustone2:not(.disabled):hover, .statustone2:not(.disabled):focus {
	background-position: -106px 0;
	transform:scale(1.1);
}
.statustone2:not(.disabled):active {
	background-position: -212px 0;
	transform:scale(1);
}
.statustone4 {
	background:url(../images/screen13/stone4.png) no-repeat;
	width: 108px;
	height: 127px;
	position:absolute;
	top: 184px;
	left: 368px;
	cursor:pointer;
	/*//opacity:1,*/

}
.statustone4:not(.disabled):hover, .statustone4:not(.disabled):focus {
	background-position: -108px 0;
	transform:scale(1.1);
}
.statustone4:not(.disabled):active {
	background-position: -216px 0;
	transform:scale(1);
}
.statustone5 {
	background:url(../images/screen13/stone5.png) no-repeat;
	width:105px;
	height:52px;
	position:absolute;
	top: 530px;
	left: 551px;
	cursor:pointer;
	z-index: 0;
}


.statustone4:a {
	background-position: -216px 0;
	transform:scale(1);
}
.dragScreen.disabled{
	cursor:default;
}

#screen13 .popup_speak.specialpop{
	background-size: 67% 51%;
}
#screen13 .popup_speak.specialpop1{
	    background-size: 88% 67%;
}
#screen13 .popup_speak.specialpop_1{
	    background-size: 58% 51%;
}
#screen13 .popup_speak.specialpop_2{
	    background-size: 90% 83%;
}
#screen13 .popup_speak.specialpop .volumebtn, #screen13 .popup_speak.specialpop_1 .volumebtn{
	left: 25px;
}
#screen13 .popup_speak.specialpop div, #screen13 .popup_speak.specialpop_1 div{
	padding-top: 15px;
}
#screen14 {
	background:url(../images/screen14/main-bg.png) no-repeat;
	background-size:100% 100%;
}
#screen14 .treasure-box {
	background:url(../images/screen14/box.png) no-repeat;
	width:462px;
	height:439px;
	position:absolute;
	top: 156px;
	left: 313px;
}
#screen14 .popup_speak {
	/*width:485px;*/
	overflow: hidden;
	padding-bottom: 20px;
	display: none;
}
#screen14 .popup_speak.active{
	display: block;
}
#screen14 .popup_speak.anim2.special_pop{
	height:150px;
} 
#screen15 {
	background:url(../images/screen15/main-bg.png) no-repeat;
	background-size:100% 100%;
}
#screen15 .popup_speak {
	/*width: 431px;
	height: 115px;*/
	overflow: hidden;
	padding-bottom: 20px;
	z-index:6;
}
#screen15 .specialpop{
	   background-size: 85% 98%;
	   width: 500px;
	   height: 100px;
}
#screen15 .pirate_f {
	background:url(../images/screen15/pirate.png) no-repeat;
	width:231px;
	height:372px;
	position:absolute;
top: 168px;
    left: 160px;

	z-index:1;
}
.stick {
	background:url(../images/screen15/stick.png) no-repeat;
	width:18px;
	height:422px;
	position:absolute;
	top: 0px;
	left:356px;
}
.flagf {
	background:url(../images/screen15/fladsprite.png) no-repeat;
	width: 346px;
	height: 276px;
	position:absolute;
	top: -57px;
	left:374px;
	-webkit-animation:flowf .7s steps(14) infinite;
	-moz-animation:flowf .7s steps(14) infinite;
	-ms-animation:flowf .7s steps(14) infinite;
	-o-animation:flowf .7s steps(14) infinite;
	animation:flowf .7s steps(14) infinite;
}
 @-webkit-keyframes flowf {
	from {
	background-position:0 0;
	}
	to {
		background-position: -4844px 0;
	}
} @-moz-keyframes flowf {
	from {
	background-position:0 0;
	}
	to {
		background-position: -4844px 0;
	}
} @-o-keyframes flowf {
	from {
	background-position:0 0;
	}
	to {
		background-position: -4844px 0;
	}
} @keyframes flowf {
	from {
	background-position:0 0;
	}
	to {
		background-position: -4844px 0;
	}
}
.treasurebox {
	background:url(../images/screen15/box.png) no-repeat;
	width: 380px;
	height: 285px;
	position:absolute;
	top: 270px;
	left: 362px;
}
.footer {
	left: 50%;
	-webkit-transform: translate(-50%, 0);
	-moz-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	-o-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
	min-width: 816px;
	height: 50px;
	position: absolute;
	top: 607px;
}
.footer .fter {
	width:816px;
	position:relative;
	margin:auto;
}
.footer .copyright {
	position: relative;
	text-align: center;
	font-size: 12px;
	margin-top: 9px;
	font-family: arial;
}
.footer .logo {
	width: 108px;
	height:48px;
	background: url('../images/support_files/tlf_logo.png') no-repeat;
	position: absolute;
	top:0px;
	left:0;
	cursor:pointer;
}
.footer .link {
	width: 88px;
	height:31px;
	background: url('../images/support_files/link.png') no-repeat;
	position: absolute;
	top:0px;
	right:0;
	cursor:pointer;
}
.footer .link a {
	width: 88px;
	height:31px;
	position:absolute;
}


/*Tabbing*/

.tabbed:focus{
    box-shadow: 0px 0px 0px 2px #ffff00;
    border-radius: 2px !important;
    outline: 0;
}
#screen6 .tabbed.focused{
    box-shadow: 0px 0px 0px 2px #ffff00;
    border-radius: 2px !important;
    outline: 0;
}

.outline{
	outline: 2px solid yellow;
}

/*End of Tabbing*/

.tabbed.selectbtn.focused{
	outline: 2px solid yellow;
}

.mapped {
       width: 100%;
    height: 99%;
    position: absolute;
    top: -8px;
    left: 0px;
	
}
.main-img{
	width: 100%;
    height: 100%;
    margin: auto;
    position: absolute;
    top: 0px;
    left: 0px;
    overflow: hidden;
}
.inner_container{
	    background: url(../images/bg-img/bg2.png) no-repeat;
    background-size: 104% 102%;
    position: absolute;
    top: -2px;
    left: -36px;
    width: 100%;
    height: 100%;
	backface-visibility: hidden;
}
.inner_container[data-locked="false"]{
	    background: url(../images/bg-img/bg4.png) no-repeat;
	    background-size: 104% 102%;
	}
.inner_container[data-locked="completed"]{
    background: url(../images/bg-img/bg5.png) no-repeat;
    background-size: 104% 102%;
}
.inner_container.shipori{
	-ms-transition: 3s ease-in-out;
	transition: 3s ease-in-out;
    transform: scale(2.8);
    -ms-transform: scale(2.8);
}

.inner_container.floodori{
	-ms-transition: 2s ease-in-out;
	transition: 2s ease-in-out;
    transform: scale(2.5);
    -ms-transform: scale(2.5);
}

.inner_container.caveori{
	-ms-transition: 3s ease-in-out;
	transition: 3s ease-in-out;
    transform: scale(2.8);  
    -ms-transform: scale(2.8);  
}

.inner_container.cannonori{
	-ms-transition: 2s ease-out;
    transition: 2s ease-out;
    transform: scale(2.8);
    -ms-transform: scale(2.8);  
}


.inner_container.sleepori{
	-ms-transition: 2s ease-out;
	transition: 2s ease-out;
    transform: scale(2.8);
    -ms-transform: scale(2.8);  
}

.inner_container.stoneori{
	-ms-transition: 1.5s ease-out;
	transition: 1.5s ease-out;
    transform: scale(3);
    -ms-transform: scale(2.8);  
}

.inner_container.treasureori{
	-ms-transition: 2s ease-out;
 	transition: 2s ease-out;
    transform: scale(2.8);
    -ms-transform: scale(2.8);  
}



/*.inner-image:hover{

    ship origin 
	
	transition: 2s ease-in-out;
    transform: scale(2.8);
    transform-origin: 140px 65px;
	
	/* flood origin  
	
	transition: 2s ease-in-out;
        transform: scale(3);
    transform-origin: 375px 115px;
	
	/* cave origin  
	
	transition: 2s ease-in-out;
    transform: scale(2.8);
    transform-origin: 420px 225px;
	
	/* canon origin 
    
	transition: 2s ease-in-out;
    transform: scale(3.5);
    transform-origin: 280px 285px;
	
	/* sleep origin 
    
	transition: 2s ease-in-out;
    transform: scale(2.8);
    transform-origin: 650px 325px;
	
	/*  stone origin 
	
	transition: 2s ease-in-out;
    transform: scale(3);
    transform-origin: 500px 445px;
	
	/*  treasure origin 
	transition: 2s ease-in-out;
    transform: scale(3);
    transform-origin: 260px 405px;
}*/


.outer_container{
	    width: 102%;
    z-index: 6;
    height: 102%;
    position: absolute;
    top: -4px;
    left: -10px;
	}
	
.bounce{
	
	-webkit-animation: bounce 0.8s linear 0s 1 forwards;
	-moz-animation: bounce 0.8s linear 0s 1 forwards;
	-o-animation: bounce 0.8s linear 0s 1 forwards;
	animation: bounce 0.8s linear 0s 1 forwards;
	/*transform: scale(1) rotate(-15deg);*/
}

@-webkit-keyframes bounce {
	0% {  transform: scale(0) rotate(0deg);}
	25% { transform: scale(1.2) rotate(0deg); }
	50% {transform: scale(1) rotate(0deg);}
	75% { transform: scale(1.2) rotate(0deg); }
	100% {transform: scale(1) rotate(0deg);}	
}
@-o-keyframes bounce {
	0% {  transform: scale(0) rotate(0deg);}
	25% { transform: scale(1.2) rotate(0deg); }
	50% {transform: scale(1) rotate(0deg);}
	75% { transform: scale(1.2) rotate(0deg); }
	100% {transform: scale(1) rotate(0deg);}
}
@-moz-keyframes bounce {
	0% {  transform: scale(0) rotate(0deg);}
	25% { transform: scale(1.2) rotate(0deg); }
	50% {transform: scale(1) rotate(0deg);}
	75% { transform: scale(1.2) rotate(0deg); }
	100% {transform: scale(1) rotate(0deg);}	
}
@keyframes bounce {
	0% {  transform: scale(0) rotate(0deg);}
	25% { transform: scale(1.2) rotate(0deg); }
	50% {transform: scale(1) rotate(0deg);}
	75% { transform: scale(1.2) rotate(0deg); }
	100% {transform: scale(1) rotate(0deg);}	
}

#screen10 .canon-explode{background:url(../images/screen10/ecplod-canon.png) no-repeat; position:absolute; width:100%; height:100%; top:0; left:0; z-index:4; background-size:100% 100%; display:none;}
#screen10.explode .popup_speak {
    width: 445px;
    height: 120px;}
	#screen10.explode .aknoeledgementbtn{ display:none;}
#screen11 .raft-stick{background:url(../images/screen11/raftstick.png) no-repeat; width: 166px; height: 176px;  position:absolute;     top: 340px;
    left: 41px; cursor:pointer;}
	#screen11 .raft-stick.hover{ background-position: -166px 0; transform:scale(1.1); }
	#screen11 .raft-stick.active{background-position: -332px 0;transform:scale(1); }
	#screen11 .raft-back{background:url(../images/screen11/raftback.png) no-repeat; width: 224px; height: 192px; position:absolute;     top: 362px;
    left: 74px; cursor:pointer; }
	#screen11 .raft-back.hover{ background-position: -224px 0; transform:scale(1.1); }
	#screen11 .raft-back.active{background-position: -448px 0; transform:scale(1); }
	
	#screen11 .raftstick1{background:url(../images/screen11/raftstick1.png) no-repeat;  width: 219px; height: 261px;    position:absolute;        top: 170px;
    left:487px; cursor:pointer; z-index:3;}
	#screen11 .raftstick1.hover,#screen11 .raftstick1:focus{background-position: -219px 0; }
	#screen11 .raftstick1.active{background-position: -438px 0; }
	#screen11 .raftbase{background:url(../images/screen11/base.png) no-repeat;  width: 346px; height: 176px;   position:absolute;    top: 330px;
    left: 430px; cursor:pointer;}
	#screen11 .raftbase.hover,#screen11 .raftbase:focus{ background-position: -346px 0; }
	#screen11 .raftbase.active{background-position: -692px 0; }
	#screen11 .drum-sprite{background:url(../images/screen11/drum-sprite.png) no-repeat;  width: 217px; height: 176px;   position:absolute;    top: 355px;
    left: 485px; cursor:pointer;}
	#screen11 .drum-sprite.hover,#screen11 .drum-sprite:focus{ background-position: -219px 0; }
	#screen11 .drum-sprite.active{background-position: -439px 0; }
	#screen11 .raft-back1{background:url(../images/screen11/raft-back.png) no-repeat;  width: 205px; height: 261px;    position:absolute;        top: 170px;
    left:487px; cursor:pointer; z-index:3;}
	#screen11 .raft-back1.hover,#screen11 .raft-back1:focus{background-position: -213px 0; }
	#screen11 .raft-back1.active{background-position: -426px 0; }
#screen11 .curtain{background:url(../images/screen11/curtain.png) no-repeat; width: 212px; height: 208px; position:absolute;    top: 185px;
    left: 503px; cursor:pointer;z-index: 2;}
	#screen11 .curtain-svg{ position:absolute;    top: 185px;
    left: 503px; cursor:pointer;}
	#screen11 .curtain.hover,#screen11 .curtain:focus{background-position: -212px 0; }
	#screen11 .curtain.active{background-position: -424px 0;}
	#screen11 .blackflag{background:url(../images/screen11/blackflag.png) no-repeat;width: 65px; height: 45px;  position:absolute;        top: 180px;
    left: 591px; cursor:pointer;z-index: 3}
    #screen11 .blackflag.hover,#screen11 .blackflag:focus{background-position: -65px 0; }
	#screen11 .blackflag.active{background-position: -130px 0;}    
	#screen11 .arrowflag{background:url(../images/screen11/flag.png) no-repeat;width: 62px; height: 45px;  position:absolute;        top: 180px;
    left: 591px; cursor:pointer;z-index: 3}
    #screen11 .arrowflag.hover,#screen11 .arrowflag:focus{background-position: -63px 0; }
	#screen11 .arrowflag.active{background-position: -125px 0;}
	.clothesopen{background:url(../images/screen11/clothe.png) no-repeat;width: 199px; height: 151px;  position:absolute;           top: 190px;
    left: 491px;
 cursor:pointer;z-index: 3}
 #screen11 .clothesopen.hover,#screen11 .clothesopen:focus{background-position: -199px 0; }
	#screen11 .clothesopen.active{background-position: -398px 0; }
#screen11 .water-animation3{     top: 125px;
    left: -205px;
    z-index: 1;}
#screen11 .water-animation3.abc{
	    top: 108px !important;
    position: absolute;
    z-index: 0;
    left: -215px !important;
    height: 234px;
}
#screen11.error .drum, #screen11.error .raft-wood,  #screen11.error .raft-curtain, #screen11.error .raft-flag, #screen11.error .clothes, #screen11.error .arrowflag, #screen11.error .raft-stick, #screen11.error .raft-back, #screen11.error .raftbase, #screen11.error .raftstick1, #screen11.error .curtain, #screen11.error .blackflag, #screen11.error .clothesopen,#screen11.error .mapbg, #screen11.error .aknoeledgementbtn, #screen11.error .button_bg{ display:none;}
#screen11.error .popup_speak{    /*width: 445px;*/
    height: 118px;}
#screen11.error	.piratewood{background:url(../images/screen11/pirate.png) no-repeat;width:478px; height:360px; position:absolute;     top: 245px;
    left: 301px;
    z-index: 12;
}
#screen13.statuerror{background:url(../images/screen13/errorscreen.png) no-repeat;width:100%; height:100%; position:absolute;     top:0px;
    left:0px; background-size:100% 100%;
    display: none;
}

#screen13.error .aknoeledgementbtn, #screen13.error .button_bg{ display:none;} 

#screen13.error .popup_speak {
    width: 445px;
    height: 120px;
}

 #screen14 .keyring {
	background:url(../images/screen14/keyring.png) no-repeat;
	width: 138px;
	height:138px;
	position:absolute;
	top: 373px;
	left: 99px;
}
#screen14 .keyfirstdata {
	position:absolute;
/* 	top: -42px;
left: -65px; */
    top: -81px;
    left: -65px;
}
#screen14 .keyring .keyfirst {
	background:url(../images/screen14/key1.png) no-repeat;
	width: 136px;
	height: 61px;
	-webkit-transform: rotate(-134deg);
	-moz-transform: rotate(-134deg);
	-ms-transform: rotate(-134deg);
	-o-transform: rotate(-134deg);
	transform: rotate(-134deg);
	cursor:pointer;
	display: block;
	position: absolute;
    top: 43px;
}
#screen14 .keyfirstdata .position {
	top: -55px;
	left: 8px;
	position:absolute;
}
#screen14 .keyring .keyfirst:hover {
	/*background-position: -136px 0;*/
}
#screen14 .keyring .keyfirst:active {
	background-position: -272px 0;
}
#screen14 .keyseconddata {
	position:absolute;
	top: -56px;
	left: 43px;
}
#screen14 .keyring .keysecond {
	background:url(../images/screen14/key2.png) no-repeat;
	width: 133px;
	height: 61px;
	-webkit-transform: rotate(-69deg);
	-moz-transform: rotate(-69deg);
	-ms-transform: rotate(-69deg);
	-o-transform: rotate(-69deg);
	transform: rotate(-69deg);
	cursor:pointer;
	display: block;
}
#screen14 .keyseconddata .position {
	top: -51px;
	left: -2px;
	position:absolute;
}
#screen14 .key_1 path:hover {
	background-position: -133px 0;
}
#screen14 .keyring .keysecond:active {
	background-position: -266px 0;
}
#screen14 .keythirddata {
	position:absolute;
	top: 10px;
	left: 99px;
}
#screen14 .keyring .keythird {
	background:url(../images/screen14/key3.png) no-repeat;
	width: 143px;
	height: 64px;
	-webkit-transform: rotate(-26deg);
	-moz-transform: rotate(-26deg);
	-ms-transform: rotate(-26deg);
	-o-transform: rotate(-26deg);
	transform: rotate(-26deg);
	cursor:pointer;
	display: block;
}
#screen14 .keythirddata .position {
	top: -56px;
	left: 1px;
	position:absolute;
}
#screen14 .keyring .keythird:hover {
	background-position: -143px 0;
}
#screen14 .keyring .keythird:active {
	background-position: -286px 0;
}
#screen14 .keyfourthdata {
	position:absolute;
	top: 107px;
	left: 72px;
}
#screen14 .keyring .keyfourth {
	background:url(../images/screen14/key4.png) no-repeat;
	width: 147px;
	height: 61px;
	-webkit-transform: rotate(33deg);
	-moz-transform: rotate(33deg);
	-ms-transform: rotate(33deg);
	-o-transform: rotate(33deg);
	transform: rotate(33deg);
	cursor:pointer;
	display: block;
}
#screen14 .keyfourthdata .position {
	top: -61px;
	left: 3px;
	position:absolute;
}
#screen14 .keyring .keyfourth:hover {
	background-position: -147px 0;
}
#screen14 .keyring .keyfourth:active {
	background-position: -294px 0;
}
#screen14 .treasure-box .lock {
	background:url(../images/screen14/lock.png) no-repeat;
	width: 100px;
	height: 99px;
	position:absolute;
	top: 181px;
	left: 95px;
	cursor:pointer;
}
#screen14 .treasure-box .lock:hover,#screen14 .treasure-box .lock.focused {
	background-position:-100px 0;
} 

#screen14 .treasure-box .lock.tabbed.focused{
    box-shadow: 0px 0px 0px 2px #ffff00;
    border-radius: 2px !important;
    outline: 0;
}

.bubble {
	position:absolute;
	top: -47px;
	left: -19px;
}

.keyElement{
	    width: 125px;
    height: 133px;
}

/*  .key1 {
   width: 125px;
   height: 133px;
}
.key2 {
	width:125px;
	height:92px;
}
.key3 {
	width:125px;
	height:92px;
}
.key4 {
	width:125px;
	height:92px;
}  */
.key5 {
	background:url(../images/screen14/bubble5.png) no-repeat;
	width:125px;
	height:92px;
}
#screen14 .treasure-box .lock:hover .key1 {
	opacity:1;
}
.shake {
	-webkit-animation:shake 1s 1;
	-moz-animation:shake 1s 1;
	-ms-animation:shake 1s 1;
	-o-animation:shake 1s 1;
	animation:shake 1s 1;
}
@-webkit-keyframes shake {0% {transform:scale(0.5);}20% {transform:scale(1);}40% {transform:scale(1.2);}60% {ransform:scale(1);}80% {transform:scale(0.8);}100% {transform:scale(1);}}
@-moz-keyframes shake {0% {transform:scale(0.5);}20% {transform:scale(1);}40% {transform:scale(1.2);}60% {ransform:scale(1);}80% {transform:scale(0.8);}100% {transform:scale(1);}}
@-o-keyframes shake {0% {transform:scale(0.5);}20% {transform:scale(1);}40% {transform:scale(1.2);}60% {ransform:scale(1);}80% {transform:scale(0.8);}100% {transform:scale(1);}}
@keyframes shake {0% {transform:scale(0.5);}20% {transform:scale(1);}40% {transform:scale(1.2);}60% {ransform:scale(1);}80% {transform:scale(0.8);}100% {transform:scale(1);}}


/*   screen14 start  */
 #screen14 .keyring {
	background:url(../images/screen14/keyring.png) no-repeat;
	width: 138px;
	height:138px;
	position:absolute;
	top: 373px;
	left: 99px;
}
#screen14 .keyfirstdata {
	position:absolute;
	/*top: -42px;*/
	    top: -82px;
	left: -65px;
}

#screen14 .keyfirstdata .position {
	top: -55px;
	left: 8px;
	position:absolute;
}
#screen14 .keyring .keyfirst:hover,#screen14 .keyring .keyfirst:focus {
	/*background-position: -136px 0;*/
}
#screen14 .keyring .keyfirst:active {
	background-position: -272px 0;
}
#screen14 .keyseconddata {
	position:absolute;
	top: -56px;
	left: 43px;
}

#screen14 .keyseconddata .position {
	top: -51px;
	left: -2px;
	position:absolute;
}

#screen14 .keyring .keysecond:hover,#screen14 .keyring .keysecond:focus,#screen14 .keyring .keysecond.hover{
	background-position: -132px 0;
}

#screen14 .keyring .keysecond:active {
	background-position: -266px 0;
}
#screen14 .keythirddata {
	position:absolute;
	top: 10px;
	left: 99px;
}

#screen14 .keythirddata .position {
	top: -56px;
	left: 1px;
	position:absolute;
}
#screen14 .keyring .keythird:hover,#screen14 .keyring .keythird:focus,#screen14 .keyring .keythird.hover {
	background-position: -143px 0;
}
#screen14 .keyring .keythird:active {
	background-position: -286px 0;
}
#screen14 .keyfourthdata {
	position:absolute;
	top: 107px;
	left: 72px;
}

#screen14 .keyfourthdata .position {
	top: -61px;
	left: 3px;
	position:absolute;
}
#screen14 .keyring .keyfourth:hover,#screen14 .keyring .keyfourth:focus,#screen14 .keyring .keyfourth.hover {
	background-position: -147px 0;
}
#screen14 .keyring .keyfourth:active {
	background-position: -294px 0;
}
#screen14 .treasure-box .lock {
	background:url(../images/screen14/lock.png) no-repeat;
/* 	width: 100px;
height: 99px; */
    width: 120px;
    height: 118px;
	position:absolute;

/*     top: 181px;
left: 74px; */
	top: 192px;
	left: 95px;

	cursor:pointer;
	display: block;
	background-position: 21px;
}
#screen14 .treasure-box .lock:not(.focused) {
    top: 182px;
    left: 74px;
}
#screen14 .treasure-box .lock:hover, #screen14 .treasure-box .lock:focus,#screen14 .treasure-box .lock.hover {
	background-position:-100px 0;
	top: 192px;
	left: 95px;
}
#screen14 .treasure-box .lock:focus {
	top: 182px;
    left: 74px;
}

#screen14 .treasure-box .lock.focused .bubble{
	display: block;
}

.bubble {
	position:absolute;
	top: -47px;
	left: -19px;
}
.key1 .keyCode{
	background:url(../images/screen14/bubble1.png) no-repeat;
	width:125px;
	height:92px;
	display:none;
}

.key2 .keyCode{
	background:url(../images/screen14/bubble2.png) no-repeat;
	width:125px;
	height:92px;
	display:none;

}
.key3 .keyCode{
	background:url(../images/screen14/bubble3.png) no-repeat;
	width:125px;
	height:92px;
	display:none;

}
.key4 .keyCode{
	background:url(../images/screen14/bubble4.png) no-repeat;
	width:125px;
	height:92px;	
	display:none;

}
.key5 .keyCode{
	background:url(../images/screen14/bubble5.png) no-repeat;
	width:125px;
	height:92px;
	display:none;

}
#screen14 .treasure-box .lock:hover .key1 {
	opacity:1;
}

.key1:hover .keyCode,.key1:focus .keyCode,.key2:hover .keyCode,.key2:focus .keyCode,.key3:hover .keyCode,.key3:focus .keyCode,.key4:hover .keyCode,.key4:focus .keyCode{
	display:block;
}

#screen14 .key1:hover .keyfirst,#screen14 .key1:focus .keyfirst{
	background-position: -136px 0;
} 

#screen14 .key2:hover .keyfirst,#screen14 .key2:focus .keyfirst{
	background-position: -136px 0;
}  

#screen14 .key3:hover .keyfirst,#screen14 .key3:focus .keyfirst{
	background-position: -136px 0;
}  

#screen14 .key4:hover .keyfirst,#screen14 .key4:focus .keyfirst{
	background-position: -136px 0;
}  


#screen14 .key1:hover .keysecond,#screen14 .key2:focus .keysecond{
	background-position: -132px 0;
} 

#screen14 .key2:hover .keysecond,#screen14 .key2:focus .keysecond{
	background-position: -132px 0;
} 

#screen14 .key3:hover .keysecond,#screen14 .key2:focus .keysecond{
	background-position: -132px 0;
} 

#screen14 .key4:hover .keysecond,#screen14 .key2:focus .keysecond{
	background-position: -132px 0;
} 

.lock:hover.lockbubble{
	display:block;
} 

#screen14 .key_1{
position: absolute;
    top: -29px;
    left: 32px;
    transform: rotate(-61deg);
    visibility: hidden;
}

#screen14 .key_2{
    position: absolute;
    top: -29px;
    left: 32px;
    transform: rotate(6deg);
    visibility: hidden;
}

#screen14 .key_3{
	    position: absolute;
    top: -9px;
    left: 12px;
    transform: rotate(3deg);
    visibility: hidden;
}
#screen14 .key_4{
	    position: absolute;
    top: -16px;
    left: 18px;
    transform: rotate(5deg);
    visibility: hidden;
}

/*  end screen14 */




/* screen 10 */
#screen10 .popup{
	display: none;
	z-index: 10;
}
.removeWhiteBg{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(250,250,250,0.5);
    z-index: 8;
}
#screen6 .removeWhiteBg{
	z-index: 109;
}
#screen10 .button_bg {
	left: 685px;
	top: 535px;
	background-position: 0 0;
	cursor: pointer;
}
#screen10 .button_bg.disabled {
	background-position:-360px 0;
	cursor: default;
}
#screen10 .button_bg:not(.disabled):hover,#screen10 .button_bg:focus {
	background-position: -120px 0;
}
#screen10 .button_bg:not(.disabled):active {
	background-position: -243px 0;
}
#screen10 .targetActivity{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index: 7;
	display: none;
}
#screen10 .targetActivity .targetActConBtn{
	top: 533px;
    left: 604px;
}
#screen10 .targetActivity .targetActConBtn.disabled{
	background-position: -631px;
	cursor: default;
}
#screen10 .popup_speak.special_pop{
	background-size: 100% 104%;
	z-index:4;
}
#screen10 .targetActivity .specialpop1{
	background-size: 65% 70%;
}
#screen10 .targetActivity .specialpop2{
	background-size: 60% 49%;
}
#screen10 .targetActivity .specialpop2 .txtfadein{
	padding-top: 15px;
}
#screen10 .target-complete .specialpop{
	background-size: 88% 87%;
}
#screen10 .canon-explode .specialpop{
	background-size: 90% 70%;
}
/*Volume button*/
.popup_speak .volumebtn:not(moov){
	opacity: 0;
}





#screen13 .v13{
	width:100%;
	height:100%;
	position: absolute;
	top:0px;
	left:0px;
	z-index: 120;
	display: none;
}

.button_bg.disable {
    background-position: -364px 0;
    left: 664px;
    top: 536px;
    cursor: default;
    z-index: 313;
}

/* screen11 Raft*/

.left_raft{
    position: absolute;
    top: 127px;
    left: -3px;
    z-index: 9;
}

 .right_raft{
	position: absolute;
    top: 172px;
    right: 43px;
	z-index: 9;
} 


.drumsvg,.raftwoodsvg,.whiteflagsvg,.blackflagsvg,.stand1svg,.stand2svg,.clothessvg,.raftcurtainsvg{
	opacity: 0;
	cursor: pointer;
}

/*right side*/
#clothes_1_,#pal1_1_ path,#Cross1,#cross2,#flag_black,#drum,#Log,#Flag_white path{
	opacity: 0;
	cursor: pointer;	
	display: none;
}

.drum-sprite,.raftstick1,.raft-back1,.raftbase,.curtain,.blackflag,.clothesopen,.arrowflag{
	display: none;
}

#screen11 .button_bg {
    /* background-position: 0px 0; */
    left: 680px;
    top: 536px;
    cursor: pointer;
    z-index:1;
}

#screen11 .button_bg.disabled{
	background-position: -363px 0;
	cursor: default;
}
    
#screen11 .map_button,#screen11 .aknoeledgementbtn{
	z-index: 10;
}

#screen11 .overlay1.darkblack{
	position:absolute;
	width:100%;
	height:100%;	
    background: rgba(0, 0, 0, 1);
    z-index: 100;
    display: none;
}

#screen6 .lighting {
    background: url(../images/screen6/lighting.png) no-repeat;
    width: 17px;
    height: 41px;
    position: absolute;
    top: 390px;
    left: 52px;
    -webkit-animation: lighting .3s steps(9) infinite;
    -moz-animation: lighting .3s steps(9) infinite;
    -ms-animation: lighting .3s steps(9) infinite;
    -o-animation: lighting .3s steps(9) infinite;
    animation: lighting .3s steps(9) infinite;
}
@-webkit-keyframes lighting{
	from{ background-position:0 0;}
	to{ background-position:0px -369px;}
}
@-moz-keyframes lighting{
	from{ background-position:0 0;}
	to{ background-position:0px -369px;}
}
@-o-keyframes lighting{
	from{ background-position:0 0;}
	to{ background-position:0px -369px;}
}
@keyframes lighting{
	from{ background-position:0 0;}
	to{ background-position:0px -369px;}
}
#screen8 .popup, #screen11 .popup, #screen13 .popup{
	display: none;
	z-index: 13;
}
#screen8 .aknoeledgementbtn.disabled, #screen13 .aknoeledgementbtn.disabled{
	background-position: -145px 0;
}
html body .container #mainGame .disabled{
	cursor: default;
}
/*
.container #mainGame #screen6 .dropstones{
	z-index: 108;
}*/

#screen11 .popup{
	width: 500px;
}
#screen10 .popup_speak.active1{
 	display: none;
 }

 .clsDivBgHidden{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	overflow: hidden;
 }