.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;
}

body {
  background-attachment: fixed;
  background-repeat: no-repeat;
  /* background-position: center; */
  background-size: 100vw 100vh;
  user-select: none;
  box-sizing: border-box;
}
#gamePage {
  margin-top: 3vh;
}
#signDiv {
  visibility: hidden;
  font-size: 4vw;
  font-weight: bold;
  color: black;
  border: 3px solid black;
  border-radius: 2vw;
  text-align: center;
  box-shadow: 11px 7px 4px rgb(0, 0, 0), inset -98px 0px 100px rgb(99, 193, 244);
  margin-top: 1vh;
}
.noPadding {
  padding: 0% !important;
}
.levelClass {
  padding: 0% !important;
  margin-top: 25vh;
  font-size: 2.4vw;
  font-weight: bold;
  color: black;
  height: 25vh;
  width: 17.5vw;
  line-height: 23vh;
  display: inline-block;
  margin-left: 2vw;
  box-shadow: 10px -17px 8px rgb(0, 0, 0),
    inset -98px 0px 100px rgba(255, 255, 255);
  border: 4px solid black;
  border-radius: 2vw;
}
.subLevelClass {
  padding: 0% !important;
  margin-top: 25vh;
  font-size: 2.8vw;
  height: 25vh;
  line-height: 23vh;
  font-weight: bold;
  color: black;
  box-shadow: 10px -17px 8px rgb(0, 0, 0),
    inset -98px 0px 100px rgba(255, 255, 255);
  border: 4px solid black;
  border-radius: 2vw;
}
.fontcls {
  font-size: 2.1vw;
  border: 2px solid black;
  margin-top: 2vh;
  font-weight: bold;
  color: black;
  background-color: aliceblue;
  border-radius: 1vw;
  height: 8vh;
  box-shadow: 3px -2px 6px rgb(0, 0, 0),
    inset -98px 0px 100px rgba(255, 255, 255);
}
.objClass {
  font-size: 2vw;
  margin-top: 2vh;
  font-weight: bold;
  color: #efe3e3;
  margin-left: 0.5vw;
}
.borderClass {
  font-size: 2vw;
  font-weight: bold;
  border: 1px solid black;
}
#numberSystemDiv {
  /* display: none; */
  /* margin-top: 3vh; */
  background-color: steelblue;
  border: 4px solid black;
  border-radius: 2vw;
  box-shadow: 8px 6px 7px #0303039c,
    inset -100px 0px 100px rgba(70, 141, 197, 0);
}
#closeNumberSystem {
  visibility: hidden;
}
#levelWiseMsg {
  font-size: 4vw;
  font-weight: bold;
  font-style: italic;
  margin-top: 5vh;
}
#congratulationsMsg {
  font-size: 2.7vw;
  margin-top: 5vh;
  font-style: italic;
}
#endMsg {
  border: 1vw solid black;
  border-radius: 2vw;
  height: 43vh;
  box-shadow: 8px 6px 7px rgb(0, 0, 0),
    inset -100px 0px 100px rgba(70, 141, 197, 0);
  color: white;
  background-color: rgb(27, 148, 217);
}
#showMsg {
  margin-bottom: 0;
  font-size: 2vw;
  font-weight: bold;
  visibility: hidden;
}
#myModal {
  display: none;
  margin-top: -2vh;
}
.question {
  font-size: 2.2vw;
  color: white;
}
#sentence {
  height: 14vh;
}
/* #equationDiv,#numberSystemDiv
{
	margin-top: 2vh;
} */
#equationDiv {
  display: none;
  border-radius: 1vw;
  border: 3px solid black;
  height: 47vh;
  background-color: #37558a;
  text-align: center;
  /* margin-top: 5vh; */
  box-shadow: 11px 17px 9px rgb(0, 0, 0),
    inset -98px 0px 100px rgba(55, 85, 138);
}
/*#takeCourseDiv
{
	visibility:hidden;
}*/
#mainDiv3 {
  border-top: 3px solid black;
  margin-top: 2vh;
}
#numberDiv3 {
  margin-top: 5vh;
}
.marginClass {
  margin-top: 3vh;
}
.calValuesClass {
  height: 9vh;
  text-align: center;
  font-size: 3.2vw;
  font-weight: 800;
  font-family: "Abril Fatface", serif;
  background-color: rgb(55, 85, 138);
  color: #fff;
  border: 1px solid black;
  border-radius: 1vw;
  box-shadow: 0.6vh 0.6vh #181717;
  outline: none;
}
.calValuesClass:active {
  background-color: #3e8e41;
  box-shadow: 0.4vh 0.4vh #666;
  transform: translateY(4px);
}

.rowClass {
  margin-top: 1vh;
}
.calButtonClass {
  height: 9vh;
  background-color: #4caf50;
  color: #fff;
  border: 1px solid black;
  border-radius: 1vw;
  box-shadow: 0.6vh 0.6vh #181717;
  outline: none;
}
.calButtonClass:active {
  background-color: #3e8e41;
  box-shadow: 0.4vh 0.4vh #666;
  transform: translateY(4px);
}
.glyphiColor {
  color: white;
  font-size: 3.2vw;
}
#level1,
#row5 {
  margin-bottom: 3vh;
}
.modal {
  display: none;
  position: fixed;
  z-index: 1;
  /* padding-top: 100px; */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.overlay {
  z-index: 10;
  background-color: rgba(0, 0, 0, 0.5);
}
.modal-content {
  background-color: rgba(38, 59, 95, 0.611764705882353);
  box-shadow: 17px 25px 14px rgb(0, 0, 0), inset -98px 0px 100px rgb(38, 59, 95);
}
#answerImg {
  margin-top: 8vh;
}
#modalDiv {
  height: 49vh;
}
.modal-content {
  border: 4px solid white;
}
.hlpClass {
  font-size: 2vw;
  font-weight: bold;
  box-shadow: 17px 25px 14px rgb(0, 0, 0), inset -98px 0px 100px rgb(38, 59, 95);
  border: 2px solid white;
}
#takeHelpMsg {
  color: white;
  font-size: 2.5vw;
  text-align: center;
  font-weight: bold;
}
/* .box
{
	background-color: #ABABAB;
	border-radius: 4px;
	border-top: 2px solid #FFF;
	border-right: 2px solid #FFF;
	border-bottom: 2px solid #C1C1C1;
	border-left: 2px solid #C1C1C1;
	box-shadow: -3px 3px 7px rgba(0, 0, 0, .6), inset -100px 0px 100px rgba(255, 255, 255, .5);
	margin-top: -1%;
} 

.row{
   margin-bottom: 3%;
   margin-left: -1%;
}


.button {
	display: inline-block;
	margin-left: 7%;
	font-size: 2vw;
	font-weight: bold;
	border-radius: 4px;
	padding:0%;
	text-align:center;
}

.display{
	    margin: 8% 0 7% 18%;
}
.display input
{
	display: block;
	padding:3%;
	height: 7vh;
	border-radius: 4px;
	border-top: 2px solid #C1C1C1;
	border-right: 2px solid #C1C1C1;
	border-bottom: 2px solid #FFF;
	border-left: 2px solid #FFF;
	background-color: #FFF;
	box-shadow: inset 0px 0px 10px #030303, inset 0px -20px 1px rgba(150, 150, 150, .2);
	font-size: 2vw;
	color: #666;
	text-align: right;
	font-weight: 500;
} 

#clearButton{
	color: #FFF;
	text-shadow: -1px -1px 0px #44006F;
	background-color: #D20000;
	border-top: 2px solid #FF8484;
	border-right: 2px solid #FF8484;
	border-bottom: 2px solid #800000;
	border-left: 2px solid #800000;
	box-shadow: 0px 0px 2px #030303, inset 0px -20px 1px #B00000;
	font-size:2vw;
}

.digits,#backSpaceButton
 {
	color: #181818;
	text-shadow: 1px 1px 0px #FFF;
	background-color: #EBEBEB;
	border-top: 2px solid #FFF;
	border-right: 2px solid #FFF;
	border-bottom: 2px solid #C1C1C1;
	border-left: 2px solid #C1C1C1;
	border-radius: 4px;
	box-shadow: 0px 0px 2px #030303, inset 0px -20px 1px #DCDCDC;
	font-size:2vw;
}

.mathButtons {
	color: #FFF;
	text-shadow: -1px -1px 0px #44006F;
	background-color: #434343;
	border-top: 2px solid #C1C1C1;
	border-right: 2px solid #C1C1C1;
	border-bottom: 2px solid #181818;
	border-left: 2px solid #181818;
	box-shadow: 0px 0px 2px #030303, inset 0px -20px 1px #2E2E2E;
	font-size:2vw;
}


.digits:hover,
.mathButtons:hover,
#clearButton:hover {
	background-color: #FFBA75;
	box-shadow: 0px 0px 2px #FFBA75, inset 0px -20px 1px #FF8000;
	border-top: 2px solid #FFF;
	border-right: 2px solid #FFF;
} */
#message {
  font-size: 6vw;
}
#endPage {
  display: none;
  /* margin-top: 11vh; */
}
/*#buttonValue12
{
	pointer-events: none;
    opacity: 0.2;
}*/
#useCalMsg {
  font-size: 3vw;
  font-weight: bold;
  color: white;
  margin: 0%;
}
@-webkit-keyframes blinker {
  50% {
    opacity: 0;
  }
}
.blink {
  -webkit-animation-name: blinker;
  -webkit-animation-duration: 0.9s;
  -webkit-animation-iteration-count: 1;
}