body{
  user-select: none;
}
#AbacusGameMainDiv {  

    background-position: center;
    background-size: cover;
    background-repeat:no-repeat;
    position: fixed;
    margin-left: 0%;
    margin-right:0%;
    margin-top:  0%;
    width:100%;
    height:100%;
    color: rgb(0,124,194);;
}
.nopadding
{
	padding:0px !important;
}

.levelImages{
  margin-top: 10vh;
}
.Number{
  font-size: 3vw;
}

#coverPage{
    width:100%;
    height:100%;
    display: none;
    background-size: cover;
}
.coverPageImage {
  position: absolute;
    width: 100%;
    height: 100%;
}
#gamePage{
    width:100%;
    height:100%;
    display: none;
}

.numberBanaoWhiteDiv{
  background-color:rgba(248, 248, 255,0.7); 
  border-radius: 19px;
  padding:0px;
  margin-left: 0%;
}
#AskedNumberInText{
    font-weight: bold;
    color: black;
    text-align: center;
    padding:0px;
    display: flex;
    justify-content: center;
    height: 8vh;
    font-size: 2.3vw;
}
#AskedQues,.NoOfBallsInColumn,.placeName{
  font-size: 2.1vw;
 }
#AskedQues{
    text-align: center;
    border-bottom: 1px solid black;
    padding: 0px;
}

#ballPickerBox{
    height: 100%;
    font-weight: bold;
    margin-top:4%;
    padding: 0px;
    display: none;
    width: 71%;
    margin-left: 15%;
    font-family: sans-serif;
}

#abacusPadOuterDiv{
    height: 100%;
    padding-left: 29px;
        width: 60%;
}

#abacusPad{
    background-color: rgba(248, 248, 255,0.7);
    border-radius: 19px;
    text-align: -webkit-center;
    height: 81%;
}

#column0,#column1,#column2,#column3,#column4{
    padding: 0px;
    height: 100%;
    border-left: 1px solid;
    border-right: 1px solid;
}

.NoOfBallsInColumn {
    text-align:center;
    font-weight: bold;
    margin-bottom: 1%;
    border-bottom: 1px solid black;
    font-family: sans-serif;
}

.ballInBallsBox {
    position:absolute;
}
/* width of balls in Balls Box */
#abacusPad > .ballFor1{
    width: 6%;
}
#abacusPad > .ballFor10{
    width: 8%;
}
#abacusPad > .ballFor100{
    width: 9%;
}
#abacusPad > .ballFor1000{
    width: 11%;
}
#abacusPad > .ballFor10000{
  width: 12%;
}
#column0 >.BeadsImages >.ballInAbacusPad{ width: 40%; }
#column1 >.BeadsImages >.ballInAbacusPad{ width: 42%; }
#column2 >.BeadsImages >.ballInAbacusPad{ width: 36%; }
#column3 >.BeadsImages >.ballInAbacusPad{ width: 30%; }
#column4 >.BeadsImages >.ballInAbacusPad{ width: 24%; }
.WidthOfBallOf1InPickerBox{   width: 40%;  }
.WidthOfBallOf10InPickerBox{  width: 50%;  }
.WidthOfBallOf100InPickerBox{ width: 60%;  }
.WidthOfBallOf1000InPickerBox{width: 70%;  }
.WidthOfBallOf10000InPickerBox{width: 90%;  }

.placeName{
    border-bottom: 1px solid black;  
}

#TextOfThousandsPlace,#TextOfHundredsPlace {
    color: orange;
   
    padding: 0px;
    margin-left: 1%;
    text-align: -webkit-right;
    display: none;
    text-align: center;
   /*  width: inherit; */
}

#TextOfSou{
      margin-left: 1%;
    padding: 0px;
    display: none;
    text-align: center;
    /*  width: inherit; */
}
#TextOfhazar{
      margin-left: 1%;
    display: none;
    text-align: center;
    /*  width: inherit; */
        padding: 0px;
}
#TextOfTensAndOnesPlace{
    padding: 0px;
    color: blueviolet;

    margin-left: 2%;     
    text-align: left;
    text-align: center;
   /*  width: inherit; */
    display: none;
}

#AnsOption{
  display: none;
}

#paryay{
   margin-top:1%;
   text-align: center;
   color:black;
   font-weight: bold;
   font-size: 2.5vw;
   
}

#AnsOptionList{
    text-align: center;
   /*    width: 34%;
    margin-left: 32%; */
    margin-top: 1%;
    /* background-color: rgba(248, 248, 255,0.7);
     color: rgb(0,124,194); */
    border-radius: 19px;
    color:black;
    padding: 0px; 
    font-weight: bold;
    
}


.ButtonsIcon{
    margin-left: 3%;
    width: 24%;
}

.prathamlogo{
    width: 56%;
    margin-left: 3vw;
}
.playIcon{
  width: 49%;
}

.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background: center no-repeat #fff;
}

/* 
@media screen and (min-width: 300px) {
   #AskedNumberInText{
    font-size: 11px;
      margin-left: 0%;
   }
   #AskedQues,.NoOfBallsInColumn,.placeName{
    font-size: 12px; 
    line-height: 1.31;
   }
     .ButtonsIcon{    width: 25%;     }

   #ballPickerBox{  font-size: 18px;  }
   #column0 >.BeadsImages >.ballInAbacusPad{ width: 40%; }
   #column1 >.BeadsImages >.ballInAbacusPad{ width: 47%; }
  #column2 >.BeadsImages >.ballInAbacusPad{ width: 42%; }
  #column3 >.BeadsImages >.ballInAbacusPad{ width: 37%; }
  #column4 >.BeadsImages >.ballInAbacusPad{ width: 32%; }
  .WidthOfBallOf1InPickerBox{   width: 60%;  }
  .WidthOfBallOf10InPickerBox{  width: 70%;  }
  .WidthOfBallOf100InPickerBox{ width: 80%;  }
  .WidthOfBallOf1000InPickerBox{width: 90%;  }
   #abacusPad,.numberBanaoWhiteDiv,#AnsOptionList{   border-radius: 10px;   }
  #AnsOption{
    font-size: 13px;
    line-height: 1.0;
  }
}


@media screen and (min-width: 400px) {
   #AskedNumberInText{
    font-size: 12px;
   }
   #AskedQues{
    font-size: 13px; 
    line-height: 1.31;
   }
   .NoOfBallsInColumn,.placeName{
    font-size: 13px; 
    line-height: 1.31;
   }
   #ballPickerBox{  font-size: 21px;  }
   #abacusPad,.numberBanaoWhiteDiv,#AnsOptionList{   border-radius: 12px;   }
   .ButtonsIcon{    width: 25%;     }
    #AnsOption{
    font-size: 14px;
    line-height: 1.1;
  }

}

@media screen and (min-width: 500px) {
   #AskedNumberInText{
    font-size: 10px;
   }
   #abacusPad,.numberBanaoWhiteDiv,#AnsOptionList{   border-radius: 13px;   }
   #AskedQues{
    font-size: 12px;  line-height: 1.36;
   }
   .NoOfBallsInColumn{
    font-size: 14px;  line-height: 1.36;
   }
   .placeName{
   	font-size: 8px;  line-height: 1.36;  padding: 0px;
   }
   #ballPickerBox{  font-size: 24px;  }
    #AnsOption{
        font-size: 12px;
    line-height: 1.3;

  }
}

@media screen and (min-width: 600px) {
   #AskedNumberInText{
    font-size: 18px; 
   }
   #AskedQues{
    font-size: 17px;
   }
   .placeName{
    font-size: 17px;
   }
   .NoOfBallsInColumn{
    font-size: 17px;
   }
   #ballPickerBox{
    font-size: 24px;
   }
   #abacusPad,.numberBanaoWhiteDiv{   border-radius: 14px;   }
    #AnsOption{
    font-size: 19px;
    line-height: 1.4;
  }

}
@media screen and (min-width: 700px) {
   #AskedNumberInText{
    font-size: 18px;
   }
   #AskedQues{
    font-size: 17px;
   }
   .NoOfBallsInColumn{
    font-size: 17px;
   }
   .placeName{
    font-size: 17px;
   }
   #ballPickerBox{
    font-size: 24px;
   }
  #abacusPad,.numberBanaoWhiteDiv,#AnsOptionList{   border-radius: 15px;   }
  #column0 >.BeadsImages >.ballInAbacusPad{ width: 42%; }
  #column1 >.BeadsImages >.ballInAbacusPad{ width: 45%; }
	#column2 >.BeadsImages >.ballInAbacusPad{ width: 42%; }
	#column3 >.BeadsImages >.ballInAbacusPad{ width: 36%; }
	#column4 >.BeadsImages >.ballInAbacusPad{ width: 30%; }
	.WidthOfBallOf1InPickerBox{   width: 45%;  }
	.WidthOfBallOf10InPickerBox{  width: 55%;  }
	.WidthOfBallOf100InPickerBox{ width: 65%;  }
	.WidthOfBallOf1000InPickerBox{width: 70%;  }
  .WidthOfBallOf10000InPickerBox{width: 77%;  }
}
@media screen and (min-width: 800px) {
   #AskedNumberInText{
    font-size: 21px;  
   }
   #AskedQues{
    font-size: 21px;
   }
   .NoOfBallsInColumn{
    font-size: 21px;
   }
   .placeName{
    font-size: 21px;
   }
   #ballPickerBox{
    font-size: 33px;
   }
   #abacusPad,.numberBanaoWhiteDiv,#AnsOptionList{   border-radius: 17px;   }

  #AnsOption{
    font-size: 20px;
  }

}
@media screen and (min-width: 900px) {
   #AskedNumberInText{
    font-size: 23px;
   }
   #AskedQues{
    font-size: 22px;
   }
   .NoOfBallsInColumn{
    font-size: 21px;
   }
   .placeName{
    font-size: 21px;
   }
   #ballPickerBox{
    font-size: 30px;
   }
   .ButtonsIcon{    width: 17%;     }
}
@media screen and (min-width: 1000px) {
   #AskedNumberInText{
    font-size: 25px; 
   }
   #AskedQues{
    font-size: 28px;     line-height: 1.3;
   }
   .NoOfBallsInColumn{
    font-size: 27px;     line-height: 1.3;
   }
   .placeName{
    font-size: 27px;     line-height: 1.3;
   }
   #ballPickerBox{
    font-size: 43px;
   }
   #abacusPad,.numberBanaoWhiteDiv,#AnsOptionList{   border-radius: 18px;   }

  	#AnsOption{
    font-size: 20px;
  }

} */
/* @media screen and (min-width: 1100px) {
   #AskedNumberInText{
    font-size: 28px;
   }
   #AskedQues{
    font-size: 28px;
   }
   .NoOfBallsInColumn{
    font-size: 28px;
   }
   .placeName{
    font-size: 28px;
   }
   #ballPickerBox{
    font-size: 43px;
   }
  
  #AnsOption{
    font-size: 22px;
  }
} */
/* @media screen and (min-width: 1200px) {
   #AskedNumberInText{
    font-size: 30px;
   }
   #AskedQues,.NoOfBallsInColumn{
    font-size: 28px;
   }
   #ballPickerBox{
    font-size: 43px;
   }

}
@media screen and (min-width: 1300px) {

  #AnsOption{
    font-size: 25px;
    margin-top: 5vh;
  }
} */
/*........................................*/
.text{
  text-align: center;
 height: 6.8vh;
}

#gameOver
{
	margin-top: 15vh;
	color: black;
    font-size: 7vw;
	font-weight:bold;
	margin-left: 28vw;
}
#acknowledgementDiv 
{
	display: block;
}
#finalPage
{
	display:none;
}
#acknowledgementDiv 
{
	display: block;
	margin-top: 2vh;
	background-color: aliceblue;
	border: 0.22vw solid black;
	border-radius: 3vw;
	text-align:center;
}
#developerNameDiv
{
	margin-bottom: 2vh;
}
.fontClass
{
	font-size:1.3vw;
	margin-top:1.5%;
	color:black;
}
.firstLetter:first-letter
{
font-size:1.5vw;
}
#finalPage
{
	display:none;
}
#widget{
  bottom: 0;
  position: fixed;
}
.hover{
  background-color: burlywood;
  background-color: rgb(255, 200, 128);
}
.optionDiv{
  font-size: 2.5vw;
  margin-top: 2vh;
  background-color: rgba(248, 248, 255, 0.598);
  border-radius: 13px;
  height: 10vh;
  padding-top: 2vh;
}
.hoverBall{
  opacity: 0.5;
}