img{}
body {
	margin: 0;
  -webkit-print-color-adjust:exact;
}
/*.tabbed:focus{
    box-shadow: 0px 0px 0px 2px #ffff00;
    border-radius: 2px !important;
    outline: 0;
}*/
div.container2{
	position: relative;
	overflow: hidden;
	width: 842px;
	height: 635px;
	}
.image{
	text-align: center;
	vertical-align: middle;
	background-color: white;
	width: 842px;
	height: 635px;
	margin: 0 auto;
	}

.okbtn {
	 position: absolute;
	 top: 340px;
	 left: 535px;
}
.p4_paper {
	position: absolute;
	top: 0.3em;
	left: 1.3em;
	width: 108px;
	border: 0px solid red;
	background: url(../images/book/a0002.png);
	background-repeat: no-repeat;
	height: 23px;
	background-position: 3% 100%;
}
.p4_paper1 {
	position: absolute;
	top: 0.3em;
	left: 1.3em;
	width: 108px;
	border: 0px solid red;
	background: url(../images/book/a0003.png);
	background-repeat: no-repeat;
	height: 23px;
	background-position: 3% 100%;
}
.p4_paper2 {
	position: absolute;
	top: 0.3em;
	left: 1.3em;
	width: 108px;
	border: 0px solid red;
	background: url(../images/book/a0004.png);
	background-repeat: no-repeat;
	height: 23px;
	background-position: 3% 100%;
}
.table {
	position: absolute;
	top: 3.3em;
	left: 4.2em;
	/* background: url('../images/play.png'); */
	/* background-repeat: no-repeat; */
	/* background-size: 100%; */
}
.table td {
}
table {
    border-collapse: collapse;
    margin: 0;
    width: 332px;
    height: 330px;
    border: 2px solid black;
}

table, td, th {
    border: 1px solid black;
    text-align: center;
}
.ten {
	font-size: 24px;
	font-family: arial;
	font-weight: bold;
}
.tab_no1 {
	position: absolute;
	top: 23.1em;
	left: 13.6em;
}
.tab_no2 {
	position: absolute;
	top: 11.3em;
	left: 25.6em;
	right: 10px;
}
.p4_cell {
	/* cursor: pointer; */
	width: 57px;
	background-color: #ffffff;
}

.p4_guideline {
	width: 14em;
	height: 67.4%;
	border: 1px solid transprants;
	position: absolute;
	top: 2.4em;
	right: 1em;
}
.p4_guideline_txt {
	font-size: 1.1em;
	font-family: arial;
	font-weight: bold;
	text-align: center;
	width: 227px;
}
.p4_guideline_col {
	height: 2.5em;
	border: 2px solid transparent;
	vertical-align: middle;
	font-family: arial;
	width: 13.4em;
	/*	overflow: hidden; */
}
.new_school {
	border: 2px solid transparent;
	vertical-align: middle;
	width: 13em;
	margin-top: -3.1px;
}
.p4_playground {
	height: 41px;
	vertical-align: middle;
	cursor: pointer;
}
.p4_classrooms {
	height: 41px;
	vertical-align: middle;
	cursor: pointer;
}
.p4_new_school_img {
    width: 64px;
    vertical-align: middle;
    cursor: pointer;
    margin: 2px 0 0 -5px;
}
.p4_new_school_img:hover	{
	width: 76px !important;
	margin-left: -8px !important;
	margin-top: 0px !important;
}
.p4_new_school_img1 {
	width: 75px;
	vertical-align: middle;
	cursor: pointer;
	margin: 8px 0 0 0px;
}
.p4_new_school_img1:hover ,.new_school_img:focus{
	width: 86px !important;
	height: 40px !important;
	margin-left: 0px !important;
	margin-top: 9px !important;
}
.p4_library {
	height: 41px;
	vertical-align: middle;
	cursor: pointer;
}
.p4_carpark {
	height: 41px;
	vertical-align: middle;
	cursor: pointer;
}
.p4_lawn {
	height: 41px;
	vertical-align: middle;
	cursor: pointer;
}
.p4_canteen {
	height: 41px;
	vertical-align: middle;
	cursor: pointer;
}
.p4_toilets {
	height: 41px;
	vertical-align: middle;
	cursor: pointer;
}
.p4_garden {
	height: 41px;
	vertical-align: middle;
	cursor: pointer;
}
.number {
	margin-top: 4px;
	/* float: right; */
	font-size: 16px;
	display: table-cell;
	width: 4em;
	/* text-align: left; */
}
.p4_number {
	margin-top: 4px;
	float: right;
	font-size: 16px;
	display: table-cell;
	width: 4em;
	text-align: right;
}
span.p4_total{
	font-size: 1em;
	font-family: arial;
	margin: 1em 0em 0em 2.5em;
	vertical-align: -0.4em;
}
/* For Button Hover */

div.okbtn1 {
	 position: absolute;
	 top: 20.8em;
	 left: 31.4em;
}
div.okbtn {
	 position: absolute;
	 top: 23em;
	 left: 31.5em;
}
.p4_imgokbtn	{
	width: 67px;
	cursor: pointer;
}
.p4_imgokbtn:hover	{
	width: 108% !important;
	margin-left: -10% !important;
	margin-top: -4% !important;
}


.p4_border {
	border: 2px solid black;
}
.p4_border_guide {
	border: 2px solid #CC0000;
}

.p4_tools {
	 position: absolute;
	 top: 8.8em;
	 left: 29.3em;
	 width: 5.8em;
	 height: 3.4em;
	 border: 2px solid transparent;
	 background-color: #ebf0fe;
	 box-shadow: 1px 1px #660099;
}
p.tools_img {
	margin: 0px;
}
img.tools_img {
	width: 34px;
	height: 34px;
	margin: 0px 0px 0px 4px;
	cursor: pointer;
	border: 3px solid transparent;
}
.guide_text {
	margin: 0;
	width: 10.1em;
	display: table-cell;
}
.p4_guide_text {
	margin: 0;
	width: 9.5em;
	/* display: table-cell; */
}
.p4_how_to_use {
	 position: absolute;
	 bottom: 4em;
	 right: 1.2em;
}
.p4_how_to_use_img {
	 width: 4.4em;
	 height: auto;
	 cursor: pointer;
}
.p4_how_to_use_img:hover {
	width: 5.2em !important;
	height: auto !important;
	margin-right: -4px !important;
	margin-bottom: -8px !important;
}
.p4_how_to_use_img1 {
	 width: 4.4em;
	 height: auto;
	 cursor: pointer;
}
.p4_how_to_use_img1:hover {
	width: 5.2em !important;
	height: auto !important;
	margin-right: -4px !important;
	margin-bottom: -4px !important;
}
.p4_main_menu {
	 position: absolute;
	 bottom: 7.8em;
	 right: 0.8em;
}
.main_menu_img {
	 width: 5.1em;
	 height: 1.8em;
	 cursor: pointer;
}


p.m0 {
	margin: 0px;
	text-align: center;
}

.feed_pop {
	 position: absolute;
	 bottom: 0.1em;
	 left: 1.5em;
	 width: 37.3em;
	 height: 5.5em;
}
.feed_pop_img {
	 width: 37.3em;
	 height: 5.2em;
	 position: absolute;
	 top: 0;
	 left: 0;
	 z-index: 1;
}

.questio_mark {
	 position: absolute;
	 bottom: 0.5em;
	 right: 2em;
	 width: 1.8em;
	 height: 1.7em;
	 /* border: 1px solid red; */
	 z-index: 100;
	 cursor: pointer;
}
.questio_mark:hover {
	width: 2.1em !important;
	height: 2em !important;
	margin-right: -2px !important;
	margin-bottom: -1px !important;
}

.center {
    margin: auto;
    width: 842px;
    border: 3px solid transparents;
    padding: 0px;
}
.p4_result_box{
	position: absolute;
	left: 423px;
	top: 52px;
	width: 9em;
	height: 4.8em;
	border: 1px solid !important;
	box-shadow: -1px 1px 0px 0px #333366;
	cursor: default !important;
}
.hide{
	opacity:0;
}
.show{
	opacity:1;
}
td.noborder{
	border: 0;
	font-family: arial;
	font-size: 20px;
	margin: 0;
}
.border_top{
border-top: 2px solid;
}
/*input.p4_inputS{
	display: inline-block;
	width:32px;
	border:2px solid red;
	text-align: right;
	font-weight: bold;
	outline: none;
	font-size: 1em;
	font-family: arial;
}*/
.p4_inputS{
	display: inline-block;
	border: 2px solid red;
	/* text-align: right; */
	/* font-weight: bold; */
	outline: none;
	/* font-size: 16px; */
	/* font-family: arial; */
	margin-left: -3px;
	margin-top: 7px;
}
/*.p4_inputS:focus{
	background-color: #DFFAFF;
}
.p4_inputS input:focus{
	background-color: #DFFAFF;
}*/
.p4_inputS input
{
	outline: none;
	border:0;
	width: 1.3em;
	text-align: center;
}
img.smile{
	display:block;
	/* margin-bottom: 0.3em; */
	text-align: center;
	vertical-align: middle;
	margin: 0.2em auto;
}
div.progressBar{
	width: 34.8em;
	height: 0.5em;
	border-top: 1px solid;
	border-bottom: 1px solid;
	position: absolute;
	top: 29.6em;
	left: 1.7em;
}
@media print{
	.colorProgress{
		background-color: #990000;
		-webkit-print-color-adjust: exact;
		width: 0.2em;
		height: 0.5em;
		margin-left: 1.2em;
		margin-right: 1em;
	}
}
.colorProgress{
	background-color: #990000;
	width: 0.2em;
	height: 0.5em;
	margin-left: 1.2em;
	margin-right: 1em;
}
.fractionImg{
	position: absolute;
	top: 26.5em;
	left: 2.2em;
	/* border: 1px solid; */
}
.p4_line{
	position:absolute;
	top: 29em;
	left: 2.9em;
	font-size: 1em;
	color: black;
	border-right: 1px solid;
	height: 1.5em;
	width: 0;
}
.imgP{width: 33.4em;}
.girlDiv{
	position:absolute;
	left: 633px;
	top: 482px;
}
.p4_feed_pop {
	position: absolute;
	bottom: 0.3em;
	left: 2.8em;
	width: 35.6em;
	height: 5.2em;
	background: url(../images/feedback1/p3_feedback.png);
	background-repeat: no-repeat;
	background-position: 100% 100%;
	background-size: 100% 100%;
}
div.smilePos1{
	position:absolute;
	left: 522px;
	top: 362px;
}
.p4_number span{
	/* width: 2.1em; */
}


@media print {
	body{page-break-inside: avoid;}
	@page {
		size: A4 portrait;  margin: 0;
	}
	.colorProgress{
		background-color: red;
		-webkit-print-color-adjust: exact;
		-moz-print-color-adjust: exact;
		-ms-print-color-adjust: exact;
		print-color-adjust: exact;
		width: 0.2em;
		height: 0.5em;
		margin-left: 1.05em;
		margin-right: 1em;
	}

}