.sm2 {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
	font-size: 1.3em;
	background: #F6F7F1;
	box-shadow: inset 0 0 30px #f2f2f2;

}

.sm2, .sm2 * {
	position: relative;
	margin: 0;
	padding: 0;
}

/*background*/
.bground{
	position: absolute;
	top:0%;
	left:0%;
	width: 100%;
	height: 100%;
}

/*sky*/
.sky{
	position: absolute;
	top:0%;
	left:0%;
	width:100%;
	height:90%;

	background: rgb(208,242,252); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(208,242,252,1) 0%, rgba(239,250,253,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(208,242,252,1)), color-stop(100%,rgba(239,250,253,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(208,242,252,1) 0%,rgba(239,250,253,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(208,242,252,1) 0%,rgba(239,250,253,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(208,242,252,1) 0%,rgba(239,250,253,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(208,242,252,1) 0%,rgba(239,250,253,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d0f2fc', endColorstr='#effafd',GradientType=0 ); /* IE6-9 */
}

/*clouds*/
.cloud1{
	position: absolute;
	top:5%;
	left:100%;
	width:17%;
}

.cloud2{
	position: absolute;
	top:25%;
	left:100%;
	width:7%;
}

.cloud3{
	position: absolute;
	top:10%;
	left:100%;
	width:12%;
}

.city{
	position: absolute;
	bottom:0%;
	left:0%;
	width:100%;
	height:30%;
	background: url("http://gituploads.olenepal.org/epaath_media/activity/science/sci_sm002/exercise/images/city.png");
	background-size: contain;
	/*border: 1px solid red;*/
}

.ground{
	position: absolute;
	top:90%;
	left:0%;
	width:100%;
	height:10%;
	border-top: 1.3em solid #7F7F7F;

	background: rgb(193,158,103); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(193,158,103,1) 0%, rgba(233,212,179,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(193,158,103,1)), color-stop(100%,rgba(233,212,179,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(193,158,103,1) 0%,rgba(233,212,179,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(193,158,103,1) 0%,rgba(233,212,179,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, rgba(193,158,103,1) 0%,rgba(233,212,179,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(193,158,103,1) 0%,rgba(233,212,179,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c19e67', endColorstr='#e9d4b3',GradientType=0 ); /* IE6-9 */
}

.sm2 .nextBtn {
	cursor: pointer;
	position: absolute;
	/*color: #006400;*/
	font-size: 2em;
	z-index: 100;
	top: 80%;
	right: 3%;
	width: 6%;
	height: 10%;
	display: none;
}

/* .nextBtn:hover , .prevBtn:hover {
	color: #90EE90;
} */

.prevBtn {
	cursor: pointer;
	position: absolute;
	color: #006400;
	font-size: 2em;
	z-index: 100;
	left: 2%;
	top: 80%;
	display: none;
}

.title {
	font-size: 1.6em;
	width: 100%;
	height: 15%;
	/*background: #000;*/
	color: #4059AD;
	margin: auto;
	margin-top: 3%;
	text-align: center;
	display: none;
}


.board{
	position:relative;
	width:100%;
	height:90%;
	/*background: #000;*/
}

.scenes {
	position:relative;
	width:100%;
	height:100%;
	/*background: #006400;*/
}

.dialog {
	position: absolute;
	/*top: 10%;*/
	bottom: 50%;
	left: 5%;
	width: 50%;
	height: 30%;
	z-index: 100;
}

.dialog p {
	position: absolute;
	/*width: 100%;*/
	bottom: 0;
	background: #fff;
	border: 0.1em solid #65E1ED;
	border-radius: 10px;
	white-space: normal;
	text-align: justify;
	padding: 0.5% 5%;
	text-align: center;

}

/*next span tag*/
.send{
	position: relative;
	font-size: 1.3em;
	color:green;
	cursor:pointer;
}

.last{
	display: none;
	position: absolute;
	top:110%;
	left:80%;
	font-size: 1.3em;
	color:blue;
	cursor:pointer;
}

.dialog:before {
	position: absolute;
	content: " ";
	background: #fff;
	height: 50px;
	width: 50px;
	border: 2px solid #65E1ED;
	border-radius: 50%;
	top: 110%;
	left: 25%;
}

.dialog:after {
	position: absolute;
	content: " ";
	background: #fff;
	height: 25px;
	width: 25px;
	border: 2px solid #65E1ED;
	border-radius: 50%;
	top: 140%;
	left: 20%;
}

.toolBox {
	position: absolute;
	top: 10%;
	/* bottom: 50%; */
	left: 5%;
	width: 60%;
	background: #BEDDE6;
	border: 0.5em solid #5293A5;
	display: flex;
	border-radius: 30px;
	z-index: 100;
	height: 49%;
	/*overflow: hidden;*/
}

.toolBox:before {
	position: absolute;
	content: " ";
	background: #BEDDE6;
	height: 50px;
	width: 50px;
	border: 2px solid #5293A5;
	border-radius: 50%;
	top: 110%;
	left: 25%;
}

.toolBox:after {
	position: absolute;
	content: " ";
	background: #BEDDE6;
	height: 25px;
	width: 25px;
	border: 2px solid #5293A5;
	border-radius: 50%;
	top: 140%;
	left: 20%;
}

.toolBox > * {
	position: relative;
	margin: 10px 2%;
	width: 30%;
	cursor: pointer;
	/*background: #fff;*/

}

.toolBox > * > img {
	width: 100%;
}

.send {
	position: relative;
	cursor: pointer;
}

/*scene 0*/
.scene0 {
	/*background: #000;*/
}

.scene0 .stickMan {
	position: absolute;
	bottom: 0;
	left: -15%;
	width: 18%;

}

.scene0 .dialog:after {
	position: absolute;
	content: " ";
	background: #fff;
	height: 25px;
	width: 25px;
	border: 2px solid #65E1ED;
	border-radius: 50%;
	top: 150%;
	left: 30%;
}

.scene0 .toolBox:after {
	height: 15px;
	width: 15px;
	left: 30%;
}


/*scene 1*/
.scene1 .stickMan{
	position: absolute;
	bottom:0%;
	left:-10%;
	width:15%;
}

.scene1 .bus{
	position: absolute;
	bottom:-0.3%;
	left:20%;
	width:32%;
}

/*scene 2*/
.scene2 .stickMan{
	position: absolute;
	bottom:0%;
	left:-10%;
	width:15%;
}

/*scene 4*/

.scene4 {

}

.scene4 .stickMan {
	position: absolute;
	width: 15%;
	z-index: 2;
	/*background: #c9c9c9;*/
	bottom: 53%;
	left: 30%;
	/* display: none; */
}

.scene4 .stickWoman {
	position: absolute;
	width: 5%;
	z-index: 2;
	bottom: 53%;
	right: 1%;
}

.scene4 .pulley {
	position: absolute;
	/*background: #000;*/
	width: 40%;
	left: 16.5%;
	height: 100%;
	/*z-index: 10;*/
	top: -0.5%;
}

.scene4 .pulley img {
	height: 100%;
	width: 100%;
}

.scene4 .wall1 {
	position: absolute;
	bottom: 0%;
	width: 40%;
	height: 53%;
	background: #7A6C6C;
	border-top:0.1em solid #6D6D6D;
	border-right:0.1em solid #6D6D6D;
	border-radius: 0.3em;
	background:url("http://gituploads.olenepal.org/epaath_media/activity/science/sci_sm002/exercise/images/brick.png");

}

.scene4 .wall2 {
	position: absolute;
	bottom: 0%;
	width: 25%;
	height: 53%;
	background: #D7BC92;
	border-top:0.1em solid #6D6D6D;
	border-left:0.1em solid #6D6D6D;
	border-radius: 0.3em;
	background:url("http://gituploads.olenepal.org/epaath_media/activity/science/sci_sm002/exercise/images/brick.png");
	opacity: 0.5;
	right: 0;
}

.scene4 .giftBox {
	position: absolute;
	width: 5%;
	bottom: 0%;
	left: 42.5%;
	z-index: 1;
	/*display: none;*/
}

.scene4 .dialog {
	width: 40%;
	bottom: 80%;
	left: 0%;
	z-index: 5;
}

.scene4 .dialog:before {
	width: 25px;
	height: 25px;
	top: 105%;
	left: 55%;
}

.scene4 .dialog:after {
	width: 10px;
	height: 10px;
	top: 125%;
	left: 60%;
	z-index: 6;
}

.scene4 .toolBox {
	width: 40%;
	bottom: 70%;
	left: 45%;
	z-index: 5;
}

.scene4 .toolBox:before {
	height: 25px;
	width: 25px;
	top: 30%;
	left: -11%;
}

.scene4 .toolBox:after {
	height: 15px;
	width: 15px;
	top: 50%;
	left: -15%;
}

.scene2 .log{
	position: absolute;
	bottom:-2%;
	left:20%;
	width:17%;
}

/*scene 3*/
.scene3 .stickMan{
	position: absolute;
	bottom:0%;
	left:-10%;
	width:15%;
}

.scooterOnly{
	display: none;
	position: absolute;
	bottom:0%;
	left:21%;
	width:15%;
}

#wall{
	position:absolute;
	bottom:0%;
	right:0%;
	width:40%;
	height:30%;
	border-top:0.1em solid #6D6D6D;
	border-left:0.1em solid #6D6D6D;
	border-radius: 0.3em;
	background:url("http://gituploads.olenepal.org/epaath_media/activity/science/sci_sm002/exercise/images/brick.png");
}

#planeContainer{
	position:absolute;
	bottom:0%;
	right:40%;
	width:25%;
	height:30%;
	/*border:0.01em solid blue;	*/
}

#inclinedPlane{
	display: none;
	position: absolute;
	bottom:-1%;
	left:0%;
	width:120%;
	border:0.2em solid brown;
	border-radius: 0.2em 0.2em 0 0;
	transform-origin:0% 0%;
	-ms-transform-origin:0% 0%; /* IE 9 */
	-webkit-transform-origin:0% 0%; /* Chrome, Safari, Opera */
	transform: rotate(-33deg);
	-ms-transform: rotate(-33deg); /* IE 9 */
	-webkit-transform: rotate(-33deg); /* Chrome, Safari, Opera */
}

/*scene 5*/
.scene5 {

}

.scene5 .stickMan {
	position: absolute;
	width: 15%;
	z-index: 2;
	/*background: #c9c9c9;*/
	bottom: 40%;
	left: 30%;
}

.scene5 .stickWoman {
	position: absolute;
	width: 4%;
	z-index: 2;
	bottom: 40%;
	right: 1%;
}

.scene5 .wall1 {
	position: absolute;
	bottom: 0%;
	width: 40%;
	height: 40%;
	background: #7A6C6C;
	border-top:0.1em solid #6D6D6D;
	border-right:0.1em solid #6D6D6D;
	border-radius: 0.3em;
	background:url("http://gituploads.olenepal.org/epaath_media/activity/science/sci_sm002/exercise/images/brick.png");

}

.scene5 .wall2 {
	position: absolute;
	bottom: 0%;
	width: 25%;
	height: 40%;
	background: #D7BC92;
	border-top:0.1em solid #6D6D6D;
	border-left:0.1em solid #6D6D6D;
	border-radius: 0.3em;
	background:url("http://gituploads.olenepal.org/epaath_media/activity/science/sci_sm002/exercise/images/brick.png");
	opacity: 0.5;
	right: 0;
}

.scene5 .svgHolder {
	position: absolute;
	width: 90%;
	height: 40%;
	bottom: 60%;
	left: 0%;
	padding-top: 10px;
	display: none;
}

.scene5 .svgHolder svg {
	width: 100%;
	height: 200%;

}

.scene5 .svgHolder2 {
	position: absolute;
	width: 90%;
	height: 40%;
	bottom: 55%;
	left: 0%;
	padding-top: 10px;
	display: none;

}

.scene5 .svgHolder2 svg {
	width: 100%;
	height: 200%;
	/*background: #c9c9c9;*/
}

.scene5 .giftBox {
	position: absolute;
	width: 5%;
	bottom: 40%;
	/*display: none;*/
}


.scene5 .giftBox2 {
	position: absolute;
	width: 5%;
	bottom: 40%;
	right: 12%;
	display: none;
}

.scene5 .flower {
	position: absolute;
	width: 5%;
	bottom: 40%;
	right: 12%;
	display: none;
}

.scene5 .leverTime {
	position: absolute;
	bottom: 38.5%;
	width: 27%;
	padding: 0;
	z-index: 1;
	display: none;
}

.scene5 .leverTime .leverWithBox {
	width: 100%;
	/*background: #c9c9c9*/
}

.scene5 .leverTime .bounce {
	position: absolute;
	right: 10%;
	cursor: pointer;
	z-index: 10;
}

.scene5 .leverThrow {
	position: absolute;
	bottom: 39.5%;
	width: 38%;
	padding: 0;
	z-index: 1;
	left: 0%;
	/*display: none;*/
}

.scene5 .leverThrow img {
	width: 100%;
}

.scene5 .dialog {
	bottom: 80%;
	z-index: 6;
}

.scene5 .dialog:before {
	top: 105%;
	left: 45%;
}

.scene5 .dialog:after {
	top: 135%;
	left: 55%;
	z-index: 6;
}

.scene5 .toolBox {
	width: 40%;
	bottom: 70%;
	left: 1%;
	z-index: 5;
}

.scene5 .toolBox:before {
	height: 25px;
	width: 25px;
	top: 110%;
	left: 70%;
}

.scene5 .toolBox:after {
	height: 15px;
	width: 15px;
	top: 125%;
	left: 80%;
}



.scene5 svg {
  display:inline;
  width: 100%;
  box-sizing:border-box;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
}

/*scene 5*/
.scene6 {

}

.scene6 .stickMan {
	position: absolute;
	width: 15%;
	z-index: 2;
	/*background: #c9c9c9;*/
	bottom: 40%;
	left: 30%;
}

.scene6 .stickWoman {
	position: absolute;
	width: 6%;
	z-index: 2;
	bottom: 40%;
	right: 7%;
}

.scene6 .wall1 {
	position: absolute;
	bottom: 0%;
	width: 40%;
	height: 40%;
	background: #7A6C6C;
	border-top:0.1em solid #6D6D6D;
	border-right:0.1em solid #6D6D6D;
	border-radius: 0.3em;
	background:url("http://gituploads.olenepal.org/epaath_media/activity/science/sci_sm002/exercise/images/brick.png");

}

.scene6 .wall2 {
	position: absolute;
	bottom: 0%;
	width: 25%;
	height: 40%;
	background: #D7BC92;
	border-top:0.1em solid #6D6D6D;
	border-left:0.1em solid #6D6D6D;
	border-radius: 0.3em;
	background:url("http://gituploads.olenepal.org/epaath_media/activity/science/sci_sm002/exercise/images/brick.png");
	opacity: 0.5;
	right: 0;
}

.scene6 .svgHolder {
	position: absolute;
	/*background: #c9c9c9;*/
	width: 60%;
	top: 30%;
	left: 35%;
	height: 40%;
}

.scene6 .svgHolder svg {
	width: 100%;
}

.scene6 .giftBox {
	position: absolute;
	width: 5%;
	bottom: 40%;
	/*display: none;*/
}


.scene6 .giftBox2 {
	position: absolute;
	width: 5%;
	bottom: 40%;
	right: 12%;
	display: none;
}

.scene6 .dialog {
	bottom: 80%;
	left: 40%;
	z-index: 6;
}

.scene6 .dialog:before {
	width: 15px;
	height: 15px;
	top: 105%;
	left: 45%;
	display: none;
}

.scene6 .dialog:after {
	width: 10px;
	height: 10px;
	top: 135%;
	left: 55%;
	z-index: 6;
	display: none;
}