body:lang(np), body:lang(np) * {
	font-family: laila !important;
  }

.bg-green{
	background-image: radial-gradient(#DBF7E9 40%, #A7EBCD 60%);
}
.cover_green{
    background-color: #9dd1c9;
}

.hidden{
	opacity: 0;
}
.show_img{
	display: block !important;
}
.chaptername{
    position: absolute;
    top: 50%;
    left: 52%;
    transform: translateX(-50%);
    /* background: rgb(191,210,202); */
    /* background: linear-gradient(180deg, rgba(191,210,202,1) 0%, rgba(191,210,202,1) 50%, rgba(250,239,203,1) 100%); */
    /* box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.75); */
    /* -webkit-box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.75); */
    /* -moz-box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.75); */
    border-radius: 20px;
    width: 30%;
}
.watertxt{
    position: absolute;
    top: 58%;
    left: 48%;
    color: #43435e;
    font-weight: 600;
}

.background{
    position: absolute;
    top: 0%;
    left: 0%;
	width: 100%;
	height: 100%;
}
.foot_play,.ball1{
    position: absolute;
    width: 66%;
    left: 20%;
    top: 40%;
}
.ball1{
    width: 4%;
    top: 87%;
    left: 67%;
    display: none;
}
.char1,.glass1,.jug1,.girl1,.girl2,.girl3{
	position: absolute;
    top: 57%;
    left: 9%;
    height: auto;
    width: 9%;
}
.glass1{
	/* border-radius: 18px; */
    left: 48%;
    top: 53%;
    width: 4%;
}
.jug1{
	left: 54%;
    top: 46%;
}
.girl1{
	display: none;
	border-radius: 50%;
    background: white;
    width: 11%;
    top: 4%;
    left: 2%;
}
.girl2,.girl3{
    display: block;
    width: 16%;
    top: 42%;
    left: 66%;
}
.girl3{
    width: 13%;
    top: 41%;
    left: 50%;
}

.move_glass{
	animation: moving_glass 3s forwards;
}
@keyframes moving_glass{
	from{
		background-color: #c9eeff;
		left: 41%;
		top: 36%;
		width: 22%;
		/* padding: 2%; */
	}
	to{
		left: 16%;
		background-color: #c9eeff;
		top: 38%;
		width: 26%;
		/* padding: 2%; */
		box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.5);
		-webkit-box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.5);
		-moz-box-shadow:0px 4px 4px 0px rgba(0,0,0,0.5);

	}
}

.spBox_1,.spBox_2,.spBox_2_1,.sp_ques,.sp_ques1,.sp_corr,.sp_3,
.sp_4,.water_prop1,.water_prop2,.water_prop3,.water_prop4{
    top: 24%;
    left: 52%;
    width: 40%;
    height: 42%;
    display: none;
    padding: 4% 4%;
}
.spBox_1{
    top: 31%;
    left: 12%;
    width: 38%;
    height: 36%;
    padding: 6% 5%;
}
.spBox_2_1{
    top: 26%;
    left: 35%;
    width: 30%;
    height: 26%;
}
.sp_ques{
	top: 4%;
    left: 34%;
    width: 32%;
	height: 30%;
}
.sp_ques1{
    top: 12%;
    left: 39%;
    width: 24%;
    height: 24%;
}
.sp_corr{
    top: 5%;
    left: 12%;
    width: 29%;
    display: block;
    height: 35%;
}
.sp_corr>p{
	left: 62%;
}
.sp_3,.sp_4{
	display: none;
    width: 36%;
    top: 10%;
    left: 58%;
}
.sp_4{
    left:38%;
}

.water_prop1{
    top: 18%;
    left: 2%;
    width: 28%;
    height: 32%;
    padding: 0%;
}
.water_prop2{
    top: 56%;
    left: 0%;
    width: 26%;
    height: 40%;
}
.water_prop3{
    top: 18%;
    left: 70%;
    width: 26%;
}
.water_prop4{
    top: 56%;
    left: 70%;
    width: 26%;
    height: 26%;
}
.water_prop2>p,.water_prop3>p{
    position: relative;
    top: 52%;
}

.optmainblk{
	position: absolute;
	top: 100%;
    left: 64%;
    height: 46%;
    width: 20%;
    background-color: transparent;
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-direction: column;
    /* border: 1px solid #c9eeff; */
}
.optdiv{
	border-radius: 8px;
    background-color: #c9eeff;
    width: 100%;
    height: 20%;
    display: flex;
    align-items: center;
    justify-content: center;
	box-shadow: 0px 2px 6px 2px rgb(77 124 143);
    -webkit-box-shadow: 0px 2px 6px 2px rgb(77 124 143);
    -moz-box-shadow: 0px 2px 6px 2px rgb(77 124 143);
}
.opttxt{
	color: #434343;
	font-weight: 500;
	
}
.optdiv:hover{
	transform: scale(1.11);
	cursor: pointer;
}
.jhilimili_gif{
    position: absolute;
    top: 0%;
    width: 100%;
    height: 126%;

}
.mainhintblock{
	position: absolute;
    height: 74%;
    width: 80%;
    top: 100%;
    left: 10%;
	background-color: #c9eeff;
	border-radius: 22px;
    box-shadow: 0px 2px 0px 2px #9dd1c9;
    -webkit-box-shadow: 0px 2px 0px 2px #9dd1c9;
    -moz-box-shadow: 0px 2px 0px 2px #9dd1c9;
}
.hintblock{
    border-radius: 22px;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    flex-direction: column;
	height: 100%;
}
.hinttxt{
	border-bottom: 3px solid #86c8bc;
    width: 70%;
}
.hintimg{
	width: 26%;
}
.cross-ico,.batti_icon{
	position: absolute;
    top: 0%;
    width: 7%;
    left: 95%;
	z-index: 9;
}
.cross-ico:hover,.batti_icon:hover{
	cursor: pointer;
}
.batti_icon{
	border-radius: 50%;
    border: 3px solid #134f5c;
    left: 90%;
    top: 4%;
	display: none;
}



.textInSp{
    width: 85%;
    left: 50%;
    top: 44%;
    transform: translate(-50%,-50%);
    text-align: center;
}
.pg4str1txt{
	padding: 1%;
    position: absolute;
    top: 0%;
    left: 21.5%;
    color: #595959;
    background: #cfe2f3;
    border-bottom-left-radius: 18px;
    border-bottom-right-radius: 18px;
	box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.75);
}

.grnColor{
	color: #0097A7;
}
.muna{
    position: absolute;
    top: 60%;
    transform: translateY(-50%);
    width: 21%;
    right: 5%;
}
.muna-front{
 left: 46%;
}
.boy{
    position: absolute;
    width: 13%;
    top: 33%;
    left: 64%;
}
.boy-front{
    width: 13%;
    top: 35%;
    left: 34%;
}
.tap{
	position: absolute;
    left: 0%;
    top: 60%;
    width: 30%;
    transform: translateY(-50%);
}
.hand1{
    position: absolute;
    top: 54%;
    left: 48%;
    width: 4%;
	display: none;
}
 .hand1:hover{
	cursor: pointer;
} 

.inverted{
	transform: rotateY(180deg);
}
.fadein{
	animation: fadeIn 1s linear forwards;
}
@keyframes fadeIn{
	0%{opacity: 0;}
	100%{ opacity: 1;}
}
.zoomIntoChar{
	animation: zoomToChar 2s linear forwards;
}
@keyframes zoomToChar{
	100%{    transform: scale(1.7, 1.7); top: 24%;}
}



@media screen and (min-aspect-ratio: 4/3) {
	.fs-3{
		font-size: 3vh;	
	}
	.fs-4{
		font-size: 4vh;
	}
	.fs-5{
		font-size: 5.5vh;
	}
	.fs-7,.chaptername{
		font-size: 7vh;
	}
	.fs-10{
		font-size: 10vh;
	}
}

@media screen and (max-aspect-ratio: 4/3) {
	.fs-3{
		font-size: 2vw;	
	}
	.fs-4{
		font-size: 2.5vw;
	}
	.fs-5{
		font-size: 3.1vw;
	}
	.fs-7{
		font-size: 4vw;
	}
	.fs-10, .chaptername{
		font-size: 7vw;
	}
}