html,body{background:#000;margin:0px;padding:0px;height: 720px; font-family:arial; font-size:20px;}

div{box-sizing:border-box;}
.textcenter{text-align:center;}
 .container{width: 1280px;
    margin: 0 auto;
    background: #e80232;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-bottom: 10px;
    position: relative;
    height: 720px;
    -webkit-border-top-right-radius: 100px;
    -moz-border-radius-topright: 100px;
    border-top-right-radius: 100px;
    overflow: hidden;
    padding: 10px;
    -webkit-box-shadow: inset -6px 4px 5px 3px rgba(214, 187, 212, 0.75);
    -moz-box-shadow: inset -6px 4px 5px 3px rgba(214, 187, 212, 0.75);
    box-shadow: inset -6px 4px 5px 3px rgba(214, 187, 212, 0.75);
    -webkit-box-shadow: inset -6px 4px 5px 3px rgba(14, 14, 14, 0.75);
    -moz-box-shadow: inset -6px 4px 5px 3px rgba(214, 187, 212, 0.75);
    box-shadow: inset -6px 4px 5px 3px rgba(14, 14, 14, 0.75);
    border: 10px solid #be2358;}
.container-border{-webkit-border-top-right-radius: 95px;
-moz-border-radius-topright: 95px;
border-top-right-radius: 95px;border:10px  solid #000;}	
	

	.mainheading{
	border-radius: 2px;
	text-align: center;
    width: 20%;
    color: #FFF;
    font-size: 2em;
    background: #d11024;
    font-weight: bold;
    position: absolute;
    padding: 4px 4px;
    left: 1px;
    top: 7px;
    -webkit-box-shadow: 2px 2px 4px 4px #4b0f22;
    box-shadow: 2px 2px 4px 4px #4b0f22;
    display: inline-block;
    z-index: 10;
	}
	.anchor3{cursor:pointer;}

.col-1-10{width:10%; float:left;}
.col-9{width:90%; float:left;}

.smsqbtn{width:40px; height:40px;background:red;border:3px solid #FFF;font-size:25px;color:#FFF;font-weight:bold;border-radius:5px; cursor:pointer;}
.smsqbtn:hover{color:#000;}

.col-4{width:25%; position:relative;box-sizing:border-box; }
	.container:after, .container-fluid:after, .row:after,.clear-fix{clear:both;}
.left_menu{        background: #d11024;
    -webkit-box-shadow: 2px 2px 4px 4px #4b0f22;
    box-shadow: 2px 2px 4px 4px #4b0f22;
    float: left;
    width: 242px;
	height:630px;
    margin: 38px 0 0 -17px;
    padding: 10px 11px; }
.clear-fix{clear:both;}
.left_menu ul{margin:0;padding:0;list-style:none;color:#FFF;font-family: Arial;}
.left_menu ul li{margin-bottom:30px;position: relative;}
.left_menu ul li a{color:#FFF; text-decoration:none; font-size:23px;height:49px;display:block;line-height:49px;padding-left:69px;}
.left_menu ul li a.what{background:url(../images/what.png) no-repeat; }
.left_menu ul li a.structure{background:url(../images/structure.png) no-repeat; }
.left_menu ul li a.example{background:url(../images/example.png) no-repeat; }
.left_menu ul li a.graphic{background:url(../images/graphic.png) no-repeat; }
.left_menu ul li a.scaffold{background:url(../images/scaffold.png) no-repeat; }
.left_menu ul li a.revision{background:url(../images/revision.png) no-repeat; }
.left_menu ul li a.activity{background:url(../images/activity.png) no-repeat; }
.white_box{background:#FFF; border-radius:10px;padding:10px;}

.left_menu ul li a.hv:hover{background-color: rgba(255, 255, 255, 0.18)!important;}
.right_content{position: absolute;
    width: 1177px;
    right: 0px;
    background:#d2868e;
    top: 9px;
    height: 680px;
    box-sizing: border-box;
    -webkit-border-top-right-radius: 80px;
-moz-border-radius-topright: 80px;
border-top-right-radius: 80px;
    padding: 10px;}
.rcontent{width:100%;height:100%; -webkit-border-top-right-radius: 75px;
-moz-border-radius-topright: 75px;
border-top-right-radius: 75px; border:0px solid rgb(241, 141, 182);padding:54px 10px 10px 10px;box-sizing:border-box;}
.rcontent_heading{font-family:arial; background:#f8f4f3; color:#000; font-size:30px;padding:5px 10px;border-radius:10px;font-weight:bold; }
.text_bg{background:#eac9d3;width:98%; margin:0 auto; box-sizing:border-box;font-size:20px; font-family:arial;padding:10px;border-radius:10px;}
.col-13{width:80%; float:left;}
.black_border_box{border:1px solid #000;padding:7px;margin-bottom:5px;overflow:hidden;font-size:16px; }

.btnborder{width:100%; padding:15px 10px; color:#000; border:5px solid #FFF;display:inline-block; background:red;box-sizing:border-box;font-size:14px;cursor:pointer; margin-bottom:10px;}
.back-div span{display:inline-block;padding:5px;background-color:transparent;}
.black_border_box{border:1px solid #000;padding:7px;margin-bottom:9px;overflow:hidden;font-size:16px; }

.btnborder{width:70%; padding:15px 10px; color:#000; border:5px solid #FFF;display:inline-block; background:red;box-sizing:border-box;font-size:14px;cursor:pointer; margin-bottom:10px;}
.back-div span{display:inline-block;padding:5px;background-color:transparent;}

/* common use */

a.book-next{width:46px; height:46px; background:url(../images/book-next.png) center no-repeat;display:block; margin:0 auto;background-size: cover;}
a.book-next:hover{background:url(../images/book-next-h.png) center no-repeat;}
a.book-prev{width:46px; height:45px; background:url(../images/book-prev.png) center no-repeat;display:block; margin:0 auto; display:none;background-size: cover;}
a.book-prev:hover{background:url(../images/book-prev-h.png) center no-repeat;}


a.a-book-next{width:52px; height:52px; background:url(../images/a-book-next.png) center no-repeat;display:inline-block; margin:0 auto;}
a.a-book-next:hover{background:url(../images/a-book-next-h.png) center no-repeat;}
a.a-book-prev{width:52px; height:51px; background:url(../images/a-book-prev.png) center no-repeat;display:inline-block; margin:0 auto; }
a.a-book-prev:hover{background:url(../images/a-book-prev-h.png) center no-repeat;}


.col-3{width:33.333333%;float:left; padding-right: 15px;  padding-left: 15px;}
.col-3_1{width:33.333333%;float:left; padding-right: 15px;  padding-left: 15px;}
input[type="text"]{font-size:18px;border:1px solid #000; width:100%;}
.smalltext{font-size:16px;}
.normaltext{font-size:18px;}
.col-2{width:50%;float:left; padding-right: 15px;  padding-left: 15px;}
textarea{width:100%; font-size:20px;border:1px solid #000;margin-top:5px;box-sizing:border-box;}
.col-1-3{width:75%;float:left; padding-right: 15px;  padding-left: 15px;}
.roundbox{border:4px solid #FFF; border-radius:10px;color:#FFF;padding:10px;}
.scroll_div{overflow-y: scroll; background:#FFF;padding:10px;height:430px;}

.hideborderdiv{border:1px solid #000;}
.hideborderdiv img{border:4px solid #FFF;}
.left{float:left;}
.right{float:right;}
/* common use */

a.anchor2{ text-decoration:none; display:inline-block; background:#0099cc;color:#000;border:3px solid #FFF; border-radius:10px;padding:10px 15px; font-weight:bold; margin:0 auto;text-align:center;}
a.anchor2:hover{color:#FFF;}
.showborder{border:1px solid #000;background:#ede7e3; float:left;}
.showborder img{margin-bottom:-5px; }

.col-1-2{width:50%;float:left;}
.col-5{width:20%;float:left; padding-right: 15px;  padding-left: 15px;min-height:1px;}
.col-5_1{width:20%;float:left; padding-right: 15px;  padding-left: 15px;min-height:1px;padding-top: 45px;}

.col-1-4{}

.text_white_bg{
	background-color: #fff;
    width: 86%;
    margin: 0 auto;
    box-sizing: border-box;
    font-size: 20px;
    font-family: arial;
    padding: 10px;
    border-radius: 10px;
}


.purposebox{
	width: 110px;
    border-radius: 12px;
    padding: 10px;
    background: #00b7ff;
    border: 6px solid #ffffff;
    font-weight: bold;
	cursor:pointer;	
    font-size: 0.9em;
	margin: 20px 0 18px 0;
	}
.purposebox:hover{
	width: 110px;
    border-radius: 12px;
    padding: 10px;
    background: #00b7ff;
    border: 6px solid #ffffff;
    font-weight: bold;
	cursor:pointer;	
    font-size: 0.95em;}
.purposebox ul{margin:0;}
.drag-me-away{    position: absolute;    width: 100%;     height: 100%;     background: orange;     top: -7px;     left: -7px;     box-sizing: content-box;      border: 7px solid #FFF; color:#FFF; font-size:30px; line-height:400%; text-align:center; cursor:pointer;}
a.next{position:absolute; display:block; background:url(../images/next.png);width:61px; height:61px; right:15px; bottom:5px;}
a.next:hover{background:url(../images/nexthover.png) no-repeat;}
a.prev{position:absolute; display:block; background:url(../images/prev.png) no-repeat;width:61px; height:61px; left:15px; bottom:5px;}
a.prev:hover{background:url(../images/prevhover.png) no-repeat;}
.wrongright{color:#FFF;border:10px solid #FFF;padding:20px 0;cursor:pointer;font-size:24px;padding:10px;}
.wrongright-hover:hover{border:10px solid #bfbfbf;}
.wrongsign{color:#990000; font-weight:bold;font-size:60px;}
.rightsign{color:#0e9e0e;font-weight:bold;font-size:60px;}
.show{visibility:hidden;}
.stbrown{background:#993333; color:#FFF; border:3px solid #FFF;padding:15px 20px; font-weight:100;}
.in-line-b{display:inline-block;width:auto;}
.border-box{border: 7px solid; border-color: orange;width:100%;background:#FFF;}
.respimg{    max-width: 100%;    margin: 0 auto;
    display: block;
    height: auto;}
a.tglspanbtn{ text-decoration:none; display:inline-block; background:#0099cc;color:#000;border:3px solid #FFF; border-radius:10px;padding:10px 15px; font-weight:bold; margin:0 auto;text-align:center;}
a.tglspanbtn:hover{color:#FFF;}
.blueborderbtn{text-decoration:none; display:inline-block; background:#0099cc;color:#FFF;border:3px solid #FFF; border-radius:5px;padding:7px 10px; font-size:14px;cursor:default;}
.lng_tab{display:inline-block; width:100%;font-size:14px;border:1px solid #000;background:red;padding:7px;margin-bottom:3px;border-radius:5px;cursor:pointer;font-weight:bold;}
.lng_tab:hover{border:3px solid;}

.lng_tab_new{display:inline-block; width:100%;font-size:14px;border:1px solid #000;background:red;padding:7px;margin-bottom:3px;border-radius:5px;cursor:pointer;font-weight:bold;}
.lng_tab_new:hover{border:3px solid;}

.lng_tab1{display:inline-block; width:100%;font-size:14px;border:1px solid #000;background:red;padding:7px;margin-bottom:6.5px;border-radius:5px;cursor:pointer;font-weight:bold;}
.lng_tab1:hover{border:3px solid;}

a.hint{width:35px; height:35px; display:block; background:url(../images/hint.png);margin:5px 0;position:relative;text-decoration:none; color:#000; font-size:14px;}
a.hint:hover{background:url(../images/hint-hover.png);}
.hint span{display:block;  width:250px;background:#ffffcd; border:1px solid; border-radius:5px;padding:5px;position:absolute;left:-470px;top:0;display:none;}
a.hint:hover > span{display:block;}

a.pdf{width:39px; height:40px;background:url(../images/pdf.png);display:inline-block; text-decoration:none; font-size:14px; text-decoration:none;color:#000;position:relative;}
a.pdf > span{position:absolute;top:14px;display:inline-block;width:100px;left:45px;display:none;}
a.pdf:hover > span{display:block;}

.activity_box{background:#FFF; border:5px solid #f0e43e;width:1100px; height:540px;border-radius:20px;padding:10px;}
.activity_heading{color:#000; font-weight:100; font-size:24px;border:3px solid  #1d5fad;padding:15px 25px; border-radius:10px;background:#e3e6a9;    width: 60%;
    margin: 0 auto;}
	.activity_heading1{color:#123966; font-weight:bold; font-size:24px;border:3px solid  #1d5fad;padding:15px 25px; border-radius:10px;background:#fcf8b1;    width: 75%;
   }
   .act-drop_overlap{position:absolute;width:103%;height:110%;background:#98d598;border:3px solid #72c04e;-webkit-box-shadow: 1px 1px 6px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    1px 1px 6px 0px rgba(50, 50, 50, 0.75);
box-shadow:         1px 1px 6px 0px rgba(50, 50, 50, 0.75);border-radius:10px;    left: -4px;
    top: -2px;color:#000;font-size:12px;padding:5px;display:none;}
	
	
	.resbox{background:#d2f0fd; margin:0 auto;border:4px solid #A8254E;padding:50px;width:50%;border-radius:20px;font-size:30px;}
	
   .act-drop{background:#777553; height:45px; border-radius:5px;width:70%;border:2px solid #5c5a40; margin-bottom:10px;-webkit-box-shadow: 1px 1px 6px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    1px 1px 6px 0px rgba(50, 50, 50, 0.75);
box-shadow:         1px 1px 6px 0px rgba(50, 50, 50, 0.75); position:relative;}
/* .draggablebox{    width: 284px;
   
     position: absolute;
    top: 141px;
    right: 59px;} */
	.smalldrag{background:#FFF; height:40px; border-radius:5px;width:100%;border:2px solid #bfdc83; margin-bottom:4px;-webkit-box-shadow: 1px 1px 6px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    1px 1px 6px 0px rgba(50, 50, 50, 0.75);
box-shadow:         1px 1px 6px 0px rgba(50, 50, 50, 0.75);cursor:pointer;font-size:11px;padding:5px;font-weight:bold;}
.drop_wrap{border-radius:15px;border:4px solid #a01324;width:100%;padding:10px 20px;}
.drop_wrap span{margin:0 15px; display:inline-block; cursor:pointer;}
.counter{border-radius:15px;border:4px solid #a01324; display:inline-block;padding:2px 15px;}
.activity_text{color:#2b4666;font-weight:100;}

a.activity-next{position:absolute; display:block; background:url(../images/activity-next.png);width:67px; height:67px; left: 1194px; top: 583px;}
a.activity-next:hover{background:url(../images/activity-next-h.png) no-repeat;}
a.activity-prev{position:absolute; display:block; background:url(../images/activity-prev.png) no-repeat;width:67px; height:67px; left: 9px; top: 593px;}
a.activity-prev:hover{background:url(../images/activity-prev-h.png) no-repeat;}
.activity-dg-box{border:3px solid #8d0a0c;padding:15px 30px;background:#FFF;border-radius:15px; position:relative;}
.drag-me-activity{    position: absolute;    width: 100%;     height: 100%;     background: #0099cb;     top: -7px;     left: -7px;     box-sizing: content-box;      border: 4px solid #000; color:#FFF; font-size:25px; font-weight:bold;  cursor:pointer; border-radius:15px;padding:10px;}
.drop-container span{color:#FFF;font-size: 19px;display:inline-block;text-align
								:center;padding:0px 0;-webkit-user-select: none; /* Chrome/Safari */        
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+ */

/* Rules below not implemented in browsers yet */
-o-user-select: none;
user-select: none;}

.result{-webkit-box-shadow: 0px -1px 30px 0px rgba(79, 79, 79, 0.92);
-moz-box-shadow:    0px -1px 30px 0px rgba(79, 79, 79, 0.92);
box-shadow:         0px -1px 30px 0px rgba(79, 79, 79, 0.92);
width:40%;
padding:10px 30px;
border:4px solid  #e8c32d ;
position:absolute;
top:-100px;background:#FFF;
left:30%; border-radius:30px;
font-size:30px;
line-height:50px;
}
.result a{border:4px solid #dc0033; display:block;float:right;font-size:20px;text-decoration:none;padding:10px 20px;line-height:20px;border-radius:15px;color:#000;}
.result a:hover{border:4px solid #8f1116; }
@media (min-width: 992px){
	.col-4 {    float: left; }
}
@media screen and (max-width: 780px) {
    .container{width:100%;box-sizing:border-box;padding:10px; 	background:#030;}
}
.b-wrap{padding:0px!important;width:358px!important; height:438px!important;}
a.nexts{position:absolute; display:block; background:url(../images/nexts.png);width:61px; height:61px; right:15px; bottom:15px;}
a.nexts:hover{background:url(../images/nextsh.png) no-repeat;}

.close{width:50px;height:51px;background:url(../images/close.png);display:block;    margin-top: 4px;}
.number {
    color: #9A131F;
    font-size: 240%;
    display: block;
    text-align: center;
    line-height: 100%;
    margin-top: 6px;
    font-weight: bold;
    font-family: arial;
}
.islash {
    display: inline-block;
    vertical-align: middle;
}
.slash {
    display: inline-block;
    width: 4px;
    height: 60px;
    background-color: #9A131F;
    transform: rotate(15deg);
}
div.sml-Box {
	width: 55px;
    line-height: 45px;
    background-color: #ffff00;
    border-radius: 14px;
    border: 5px solid #fff;
    text-align: center;
    cursor: pointer;
    font-size: 1.2em;
	margin:5px;
}
div.sml-Box:hover {
    color:#fff;
	font-size: 1.5em;
}
div.sml-box-txt {
    width: 655px;
    /* line-height: 65px; */
    margin: 13px 0 0 16px;
	visibility:hidden;
}
#shw{
	width: 46px;
    height: 46px;
    float: right;
	margin: -55px 20px 0 0;
	background-image:url('../images/zoom.png');
	cursor:pointer;
    backgrou:no-repeat;
    background-size: 40px;
}
#shw:hover{
	-ms-transform: scale(1.1, 1.1); /* IE 9 */
    -webkit-transform: scale(1.1, 1.1); /* Safari */
    transform: scale(1.1, 1.1);
	background-image:url('../images/zoom.png');
	cursor:pointer;
}
#zoomDiv{
	width: 100%;
    display: inline-flex;
	-ms-transform: scale(1.04,1.2); /* IE 9 */
    -webkit-transform: scale(1.04,1.2); /* Safari */
    transform: scale(1.04,1.2);
    /* margin: 0 0 0 80px; */
}

#shw1{
	width: 46px;
    height: 46px;
    float: right;
	margin: -55px 20px 0 0;
	background-image:url('../images/zoom.png');
	cursor:pointer;
	background-repeat: no-repeat;
	background-size: 40px;
}
#shw1:hover{
	-ms-transform: scale(1.1, 1.1); /* IE 9 */
    -webkit-transform: scale(1.1, 1.1); /* Safari */
    transform: scale(1.1, 1.1);
	background-image:url('../images/zoom.png');
	cursor:pointer;
}
#shw2{
	width: 46px;
    height: 46px;
    float: right;
	margin: -55px 20px 0 0;
	background-image:url('../images/zoom.png');
	cursor:pointer;
    background-repeat: no-repeat;
    background-size: 40px;
    
}
#shw2:hover{
	-ms-transform: scale(1.1, 1.1); /* IE 9 */
    -webkit-transform: scale(1.1, 1.1); /* Safari */
    transform: scale(1.1, 1.1);
	background-image:url('../images/zoom.png');
	cursor:pointer;
}
#zoomDiv2{
	width: 79%;
    display: inline-flex;
    transform: none;
    font-size: 0.95em;
    transform: scale(1.1, 1.1);
    margin: -9px 0 0 90px;
	-ms-transform: scale(1.1, 1.1); /* IE 9 */
    -webkit-transform: scale(1.1, 1.1); /* Safari */
    transform: scale(1.1, 1.1);
}
.back-div span {
    padding: 0px;
}
#shw3{
	width: 46px;
    height: 46px;
    float: right;
	margin: -55px 20px 0 0;
	background-image:url('../images/zoom.png');
	cursor:pointer;
	background-repeat: no-repeat;
	background-size: 40px;
}
#shw3:hover{
	-ms-transform: scale(1.1, 1.1); /* IE 9 */
    -webkit-transform: scale(1.1, 1.1); /* Safari */
    transform: scale(1.1, 1.1);
	background-image:url('../images/zoom.png');
	cursor:pointer;
}
#ballBox {
	width: 642px;
    height: 449px;
	float:right;
    padding: 8px;
    background-image: url(../images/basket_ball.png);
    background-repeat: no-repeat;
	visibility:hidden;
}
#ball {
  position: relative;
  width: 150px;
  height: 60px;
  top:298px;

}
.btn-style {
    line-height: 46px;
	cursor:pointer;
}
.btn-style:hover {
    color:#FFBBBB;
}
#gameOver{
	width: 40%;
    height: 78%;
    border-radius: 19px;
    background-color: #fff;
    /* border: 6px solid #fc0; */
    margin: 52px auto;
	display:none;
}
#gameOverHead >div {
   font-size: 1.7em;
    font-weight: bold;
    margin: 50px auto;
    color: #e10000;
    width: max-content;
}
#gameOverBody >div {
    text-align: center;
    width: 83%;
    margin: 40px auto;
    border-radius: 25px;
    font-size: 1.5em;
}
/*  */

#drag-1, #drag-2 {
  width: 25%;
  height: 100%;
  min-height: 6.5em;
  margin: 10%;

  background-color: #29e;
  color: white;

  border-radius: 0.75em;
  padding: 4%;

  -webkit-transform: translate(0px, 0px);
          transform: translate(0px, 0px);
}

#drag-me::before {
  content: "#" attr(id);
  font-weight: bold;
}
.draw-height{
	background-color: #000;
    width: 2px;
    height: 57px;
    float: left;
}
/*  */

.inner-dropzone {
  height: 45px;
  /*! border: 0.5px solid red; */
  width: 100px;
  text-align: center;
}

.dropzone {
  background-color: #fff;
  border: dashed 4px transparent;
  /* border-radius: 4px; */
  /* margin: 10px auto 30px;
  padding: 10px;
  width: 80%; */
  transition: background-color 0.3s;
  /*  */
  width:15%; 
  float:left; 
}

.drop-active {
  border-color: #aaa;
}

.drop-target {
  background-color: #29e;
  border-color: #fff;
  border-style: solid;
}

.drag-drop {
  display: inline-block;
    min-width: 40px;
    background-color: #FFCC00;
    border: solid 2px #000;
    -webkit-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
    transition: background-color 0.3s;
}

.drag-drop.can-drop {
  /* color: #000;
  background-color: #4e4; */
}

.obj-dropped {
}
 
#yes-drop1,#yes-drop2,#yes-drop3,#yes-drop4,#yes-drop5,#yes-drop6,#yes-drop7,#yes-drop8,#yes-drop9,#yes-drop10,#yes-drop11{
  width: 131px; 
  text-align: center; 
  line-height: 32px;
}

div#checkAns {
    position: absolute;
    width: min-content;
    background-color: #fff;
    border: 3px solid #006699;
    border-radius: 5px;
    padding: 5px;
    right: 130px;
	top: 232px;
	cursor:pointer;
}
div#checkAns:hover {
    background-color: #adacac;
    color: #fff;
	cursor:pointer;
}
div#replayGame {
    position: absolute;
    width: min-content;
    background-color: #fff;
    border: 3px solid #009900;
    border-radius: 5px;
    padding: 5px;
    right: 130px;
	top: 278px;
	cursor:pointer;
}
div#replayGame:hover{
    background-color: #adacac;
    color: #fff;
	cursor:pointer;
}
img{
	width:100%;
	display:block;
}
#whatTab1{
	width: 610px;
    margin: -102px 0 0 219px;
}
div#whatTab12 {
    width: 20%;
    float: left;
    margin: 0px 0 0 56px;
	visibility:hidden;
}
/* div#whatTab13 {
    margin: -300px 0 0 0;
} */
div#whatTab10 {
    width: 230px;
    margin: -75px 190px 0 0;
    float: right;
}
div#whatTab11 {
    visibility: hidden;
    width: 50%;
    margin: 0 0 0 120px;
    float: left;
}
div.tab13Box1 {
    width: 289px;
    height: 284px;
    background-color: #fff;
    margin: 0 0 0 145px;
    border: 1px solid;
}
div.tab13Box2 {
    width: 333px;
    height: 225px;
    background-color: #fff;
    margin: -254px 0 0 524px;
    border: 1px solid;
}
div#whatTab21 {
    display: inline-block;
    width: 249px;
    margin: 0 0 0 70px;
}
div#whatTab22 {
    width: 175px;
    position: absolute;
    top: 410px;
    right: 150px;
}
div#whatTab23 {
    width: 165px;
    position: absolute;
    top: 431px;
    right: 330px;
}
#whatTab221 {
    width: 215px;
    padding: 5px;
}
#whatTab221 >img {
    width: 100%;
}
#whatTab3 {
	float: left;
    width: 72%;
}
div#whatTab31 {
    width: 315px;
    position: absolute;
    top: 210px;
    right: 70px;
}
div#whatTab32 {
    width: 275px;
    position: absolute;
    top: 240px;
    right: 230px;
}
div#whatTab4 {
    background-color: #fff;
    margin: 42px auto;
    padding: 10px;
	height: 55%;
	width: 95%;
	border-radius: 15px;
}
div.whatTab41 {
    width: 100%;
    display: flex;
    align-items: center;
	margin-top: 10px;
}
div#whatTab42 {
    width: 23%;
    padding: 10px 10px 10px 10px;
    margin: 0 20px 0 0;
}
div#whatTab43 {
    width: 50%;
    margin: 0 0 0 20px;
	visibility: hidden;
}
div.whatTab71 {
    background-color: #f99e00;
    width: max-content;
    padding: 10px;
    border: 5px solid #fff;
    float: left;
}
div.whatTab72 {
    width: 582px;
    height: 62px;
    background-color: #fff;
    border: 1px solid #000;
	margin-bottom: 10px;
	overflow: hidden;
}
.num-style{
	width: 30px;
    font-size: 1.3em;
    color: #fff;
    background-color: #ff0404;
    text-align: center;
    border-radius: 50%;
    border: 3px solid #fff;
    margin: 13px;
	padding: 5px;
	font-weight: bold;
}
div#structTab1 {
    width: 64%;
    margin: 30px auto;
}
div.structTab2 {
    width: 91%;
    height: 322px;
    background-image: url(../images/img56.png);
    background-repeat: no-repeat;
    background-size: 100% 336px;
    margin: 11px 0 0 51px;
}
div.structTab21 {
    width: 15%;
    height: 162px;
    float: left;
    display: flex;
    align-items: center;
    color: #fff;
    margin: 95px 0 0 95px;
	cursor: pointer;
	opacity: 0;
}
div.structTab3 {
    width: 36%;
    float: left;
    margin: -76px 0 0 0;
}
div#structTab41 {
    width: 17%;
    position: absolute;
    top: 42px;
    right: 1px;
}
div#structTab42 {
    width: 17%;
    position: absolute;
    top: 262px;
    right: 91px;
}
div#structTab43 {
    width: 29%;
    position: absolute;
    top: 422px;
    right: 251px;
}
div#structTab5 {
    width: 48%;
    position: absolute;
    top: 435px;
    right: 324px;
}
div#structTab6 {
    width: 29%;
    float: right;
}
.newClick{
	height: 62px;
    width: 110px;
    font-size: 0.88em;
    margin: 0px 10px 0px 0px;
    cursor: default;
    opacity: 1;
    border: none;
    /*display: flex;
    align-items: center;*/
    background-image: url(../images/img57.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: 68%;
	cursor: pointer;
}
.newClick:hover{
	height: 62px;
    width: 110px;
    font-size: 0.88em;
    margin: 0px 10px 0px 0px;
    cursor: default;
    opacity: 1;
    border: none;
    /*display: flex;
    align-items: center;*/
    background-image: url(../images/img63.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position-y: 68%;
	cursor: pointer;
}
#shwBody {
    width: 72%;
    font-size: 0.85em;
    transform: none;
    margin: 0;
    float: left;
}
#shwBody1 {
    width: 820px;
    font-size: 0.85em;
    transform: none;
    margin: 0 0 0 56px;
    float: left;
}
#shwBody2 {
    width: 72%;
    font-size: 0.85em;
    transform: none;
    margin: 0 0 0 56px;
    float: left;
}
#shwBody3 {
    width: 72%;
    font-size: 0.85em;
    transform: none;
    margin: 0 0 0 56px;
    float: left;
}
#expTab61 >div{
    width: 57%;
    float: right;
}
div#expTab62 {
    width: 64%;
    float: right;
    margin: 100px 0 0 0;
}
#expTab61{
	position: absolute;
    top: 173px;
    left: 200px;
}
#expTab71 >div{
    width: 56%;
    float: right;
	border: 5px solid #fff;
}
div#expTab72 {
    width: 55%;
    float: right;
    margin: 105px 0 0 0;
	border: 5px solid #fff;
}
#expTab71{
	position: absolute;
    top: 173px;
    left: 192px;
}
#expTab81 >div{
    width: 25%;
    float: right;
}
div#expTab82 {
    width: 29%;
    float: right;
    margin: 105px 0 0 0;
}
#expTab81{
	position: absolute;
    top: 173px;
    left: -128px;
}
.linktxt{
	font-size: 0.8em;
}
#shw3Zoombody{
	display:none;
    width: 993px;
    margin: -56px 0 0 86px;
}

.acti11 {
    border: 5px solid #1D5FAD;
    border-radius: 35px;
    padding: 12px;
    font-size: 1em;
    height: 160px;
    background-color: #f7eb205c;
    width: 96%;
    margin: 0 auto;
}
.acti11 div:nth-child(1) {
    text-align: center;
    color: black;
    font-weight: bold;
    font-size: 1.1em;
}
.acti12{
	color: #113865;
    font-size: 0.95em;
    font-weight: bold;
}
.acti13{
	width: 100%;
    height: 70%;
}
.acti14{
	text-align: center;
    width: 231px;
    position: absolute;
    top: 253px;
    left: 170px;
	font-size: 1.1em;
    font-weight: bold;
}
.word-style{
	cursor: pointer;
    position: absolute;
    top: 190px;
    left: 30px;
}
.font-high{
	color: red;
    font-weight: bolder;
}
.title-img {
    width: 12%;
    position: absolute;
    top: 0;
    right: 50px;
    z-index: 1;
}
.acti31 {
    font-weight: bold;
    color: #113865;
    width: 38%;
    margin: 10px 20px;
}
.acti32 {
    border: 5px solid #fffa90;
    border-radius: 35px;
    padding: 10px;
    height: 359px;
    background-color: #ffffff;
    width: 55%;
    float: left;
    box-shadow: 0 0 34px 1px;
    margin: 15px 0 0 40px;
}
/*.acti32 div {
    cursor: pointer;
}
 .acti32 div:hover {
    background-color: #bb49498a;
    color: #fff;
} */
.acti33 {
    border: 3px solid #000;
    margin: -67px 0px 0 19px;
    padding: 10px;
    border-radius: 33px;
    height: 424px;
    width: 40%;
    float: left;
}
.clk-span{
	cursor:pointer;
}
#game-maks {
    background-color: #ad9e05;
    border: 5px solid #9A131F;
    border-radius: 16px;
    color: #9A131F;
    font-size: 2em;
    font-weight: bolder;
    width: max-content;
    height: max-content;
    float: right;
    padding: 5px 30px 5px 30px;
	margin: -15px 126px 0 0;
}
.edit-field{
	margin: 23px 0 0 0;
    background-color: #fff;
    border: 2px solid #000;
    padding: 2px;
}
.structTab31 {
    background-image: url(../images/img43.png);
    background-repeat: no-repeat;
    background-size: 80% 290px;
    width: 80%;
    background-position-x: 50%;
    height: 290px;
    margin: 25px auto;
	color: #fffefc;
    font-size: 0.9em;
}

.structTab41 {
    background-image: url(../images/img44.png);
    background-size: cover;
    width: 36%;
    height: 284px;
    margin: 0 auto;
}
.structTab42 {
    width: 781px;
    margin: 0 auto;
}
.edit-field1 {
    /* margin: 23px 0 0 0; */
    background-color: #fff;
    border: 2px solid #000;
    padding: 2px;
    width: 80%;
    margin: 0 auto;
}
.structTab51 {
    width: 200px;
    margin: 10px 0 0 15px;
    float: left;
    background-color: #67d4f9;
    font-size: 0.8em;
    padding: 5px;
    border: 2px solid #fff;
	height: 178px;
}
.structTab52 {
    width: max-content;
    background-color: #f1e43e;
    font-size: 0.8em;
    font-weight: bold;
    padding: 7px;
    border: 2px solid #fff;
    border-radius: 18px;
    margin: 35px 0px 0 46px;
    float: left;
}
.structTab61{
	width: 70%;
    margin: 80px auto;
}
#structTab53 {
    width: 20%;
    position: absolute;
    top: 568px;
    left: 729px;
    font-size: 0.6em;
	opacity: 0;
	cursor:pointer;
}
.grahTab1 {
    width: 951px;
    margin: -9px auto;
}
.mark-txt-style{
	width: 140px;
    line-height: 71px;
    text-align: center;
    font-size: 2.3em;
    font-weight: bold;
    color: #a6160b;
    border: 6px solid #a6160b;
    border-radius: 12px;
    background-color: #f1e43e;
    float: right;
    margin: -30px 0 0 0;
}
#winner-txt{
	width: 40%;
    height: 210px;
    /* display: flex; */
    text-align: center;
    background-color: #fff;
    border: 5px solid #f1e43e;
    border-radius: 35px;
    position: absolute;
    top: 61px;
    left: 381px;
    box-shadow: 0 0px 31px 7px;
	display:none;
}
#winnerTxt{
	padding: 28px 0 0 0;
    font-size: 1.1em;
}
#resetBtn{
	width: min-content;
    background-color: #fff;
    border: 2px solid #c71010;
    border-radius: 12px;
    padding: 8px;
    float: right;
    margin: 0 21px 0 0;
    cursor: pointer;
}
#resetBtn:hover{
	box-shadow: 0 0 18px 1px;
}
#resetGame{
	width: 100%;
    height: 70%;
}
.acti21{
	width: 80%;
    margin: 58px auto;
    font-weight: bold;
    color: #113865;
    line-height: 48px;
    font-size: 1.3em;
}
.acti22{
	width: 390px;
    margin: 0 auto;
}
.acti41{
	width: 40%;
    margin: 40px auto;
}
.acti51{
	font-weight: bold;
    color: #113865;
    width: 70%;
    margin: 30px auto;
}
.acti52{
	width: 50%;
    margin: 65px auto;
    line-height: 34px;
    border-radius: 5px;
    border: 4px solid #08afd2;
    padding: 15px;
}
.acti63{
	width: 56%;
    border: 1px solid #000;
    border-radius: 5px;
    box-shadow: 0 0 4px 0;
    padding: 4px;
    margin: 5px 0 0 73px;
    font-size: 0.89em;
	-webkit-user-select: none; /* Safari 3.1+ */
    -moz-user-select: none; /* Firefox 2+ */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* Standard syntax */
}
.word-bg{
	width: 250px;
    height: 331px;
    border: 5px solid #f1e43e;
    position: absolute;
    top: 180px;
    right: 110px;
    border-radius: 23px;
}
.word-style1{    
	cursor: pointer;
    position: absolute;
    top: 206px;
    left: 910px;
    z-index: 1;
}
.gameOverHead{
    font-size: 1.8em;
    text-align: center;
    margin: 10px 0 10px 0px;
    color: #a7160b;
    /* font-weight: bold; */
}
/* #gameOverBody{
	width: 571px;
    background-color: #9ee5f9;
    margin: 60px auto;
    padding: 60px;
    border: 5px solid #a7160b;
    border-radius: 25px;
    font-size: 1.5em;
} */
.activity_gameOver{
	display:none;
}
.purposebox2 {
    width: 140px;
    border-radius: 12px;
    padding: 10px;
    background: #00b7ff;
    border: 6px solid #ffffff;
    font-weight: bold;
    cursor: pointer;
    font-size: 0.9em;
    margin: 10px 18px 10px 0;
}
#whatTab24{
	width: 50%;
    height: 44%;
    background-color: #fff;
    border: 1px solid #000;
    padding: 5px;
    margin: 0 0 0 82px;
	overflow: hidden;
}
.show21{
	visibility:hidden;
}
.show22{
	visibility:hidden;
}
.show23{
	visibility:hidden;
}
.show31{
	visibility:hidden;
}
.show32{
	visibility:hidden;
}
.sml-box-edit{
	width: 80px;
    height: 80px;
    border: 1px solid;
    border-radius: 5px;
    float: left;
	overflow:hidden;
}
.acti34{
	width: min-content;
    border: 2px solid #000;
    border-radius: 10px;
    padding: 2px;
    font-weight: 600;
    font-family: sans-serif;
    color: #a6160b;
	background-color:#fff;
}
.acti35{
	margin: 10px 0 0 10px;
	cursor: pointer;
	font-weight: bold;
}
.acti35:hover{
	color: #6d6c6c;
}
#gameOverHead {
   font-size: 1.7em;
    font-weight: bold;
    margin: 50px auto;
    color: #e10000;
    width: max-content;
}
#gameOverBody{
    text-align: center;
    width: 83%;
    margin: 40px auto;
    border-radius: 25px;
    font-size: 1.5em;
}

.example1 {
    width: 75%;
    float: left;
	margin: 0 0 10px 0;
}
.example2 {
    width: 25%;
    float: right;
    height: 151px;
	text-align: right;
}
.exp-bg{
	background: #ffffff;
    padding: 10px;
    border: 1px solid;
}
div#startGame{
	font-family: sans-serif;
    font-size: 3em;
    font-weight: 900;
    color: #b2131a;
    border: 4px solid #2b2b2b;
    border-radius: 10px;
    text-align: center;
    width: 205px;
    line-height: 71px;
    margin: 0 auto;
    box-shadow: 0px 0px 27px 3px;
	cursor: pointer;
	user-select: none;
}
div#startGame:hover{
	transform:scale(1.02, 1.02);
}
.showBoxTxt{
	position: absolute;
    top: 461px;
    right: 0px;
    width: 111px;
    line-height: 59px;
    border: 5px solid #a51319;
    color: #a51319;
    font-size: 2em;
    font-weight: bold;
    text-align: center;
    background-color: #e8c32d;
    border-radius: 15px;
}
/* ----------BEE CSS-------------- */
#wrapper {
    width:942px; 
        border: 4px solid #000;
    height: 390px;
    border-radius: 25px;margin:0;padding:0;
	    cursor:  url(../images/activity/hunt.png) 50 50, none;
	}
#wrapper span{  width: 81px;
    height: 84px;    
   
    background:url(../images/activity/bee.png); position: absolute;}	
/* 		#wrapper span span{    position: absolute;
		display: inline-block;
		background: #FFF;
	   text-align:center;
		min-width: 75px;
		font-size: 21px;
		font-weight: bold;
		height: 32px;
		line-height: 32px;
		border: 2px solid #000;
		border-radius: 10px;
	   
		left: 50%;
		top: 34px;
		transform: translateX(-50%);} */
#wrapper span span{    
	position: absolute;
    display: inline-block;
    background: #fff0;
    text-align: center;
    min-width: 75px;
    font-size: 13px;
    font-weight: bold;
    height: 32px;
    line-height: 15px;
    /* border: 2px solid #000; */
    border-radius: 10px;
    left: 50%;
    top: 35px;
    transform: translateX(-50%);
	}

     #wrapper li {
	 list-style:none;
    position: absolute;
    width: 81px;
    height: 84px;    
    
    background:url(../images/activity/bee.png);
  
    text-align:center;
    cursor:pointer; }
	
#mycursor {
     cursor: none;
     width: 173px;
     height: 185px;
     background: url("../images/activity/hunt.png") no-repeat center top;
     position: absolute;
     display: none;
     top: 0;
     left: 0;
     z-index: 10000;
}

ul#wrapper li span{    position: absolute;
    display: inline-block;
    background: #FFF;
   
    min-width: 75px;
    font-size: 21px;
    font-weight: bold;
    height: 32px;
    line-height: 32px;
    border: 2px solid #000;
    border-radius: 10px;
   
    left: 50%;
    top: 34px;
    transform: translateX(-50%);}
a.nexts{position:absolute; display:block; background:url(../images/nexts.png);width:61px; height:61px; right:15px; bottom:15px;}
a.nexts:hover{background:url(../images/nextsh.png) no-repeat;}	
/* ------------------------ */

.pic-word{
	float: left;
	user-select: none;
}
.pic-word div{
	border: 2px solid;
    width: 90px;
    text-align: center;
    line-height: 25.5px;
    font-size: 1em;
    margin: 1.5px 0px 0px 0px;
}

.lines{
	transform-origin: 0 0;
	border-bottom: 4px solid #f101e1;
    position: absolute;
}
#line1{
	width: 440px;
    top: 134px;
    left: 195px;
    transform: rotate(358deg);
}
#line2{
	width: 440px;
    top: 200px;
    left: 199px;
    transform: rotate(353deg);
}
#line3{
	width: 350px;
    top: 197px;
    left: 291px;
    transform: rotate(357deg);
}
#line4{
	width: 461px;
    top: 468px;
    left: 253px;
    transform: rotate(325deg);
}
#line5{
	width: 343px;
    top: 459px;
    left: 377px;
    transform: rotate(319deg);
}
#line6{
	width: 156px;
    top: 165px;
    left: 524px;
    transform: rotate(404deg);
}
#line7{
	width: 235px;
    top: 387px;
    left: 415px;
    transform: rotate(339deg);
}
#line8{
	width: 165px;
    top: 387px;
    left: 478px;
    transform: rotate(339deg);
}
#line9{
	width: 75px;
    top: 383px;
    left: 565px;
    transform: rotate(339deg);
}
#line10{
	width: 373px;
    top: 383px;
    left: 265px;
    transform: rotate(361deg);
}
#line11{
	width: 247px;
    top: 257px;
    left: 453px;
    transform: rotate(402deg);
}
#line12{
	width: 452px;
    top: 467px;
    left: 188px;
    transform: rotate(358deg);
}
#line13{
	width: 461px;
    top: 330px;
    left: 201px;
    transform: rotate(380deg);
}
#line14{
	width: 135px;
    top: 477px;
    left: 504px;
    transform: rotate(375deg);
}
.svg{
	position: absolute;
    padding: 5px;
    border: 1px solid red;
    top: 107px;
    left: 184px;
    width: 520px;
    height: 380px;
}
.section-done::after{
    content: "\2713";
    position: absolute;
    width: 20px;
    height: 20px;
    background-color: #d9fd9b;
    top: 0;
    left: -10px;
    color: #008011;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bolder;
}