body{

	margin: 0px;

	padding: 10px;

	background-color: #ffffff;

}



.body-m{

	padding: 0px;

	margin-top: 10px 0px 10px 0px;

	background-color: #ffffff;

}

#app-main-window{



	width: 100%;



	height:100%;

	min-height: 800px;

	max-height: 1000px;



	border-radius: 10px;

	

	background-color: #ffffff;

  	background-image: url("bg1.jpg");

  	background-repeat: no-repeat;

  	background-position: center top;

	background-size:cover;

	

	padding: 0px;



	display: flex;



	flex-direction: column;



	justify-content: flex-start;



	align-content: center;



	align-items: center;

	

	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";



}



#app-main-window-m{



	width: 100%;

	height: 600px;

	min-height: 600px;

	max-height: 800px;



	border-radius: 0px;

	

	background-color: #ffffff;

  	background-image: url("bg1.jpg");

  	background-repeat: no-repeat;

  	background-position: center top;

	background-size:cover;

	

	padding: 0px;



	display: flex;



	flex-direction: column;



	justify-content: flex-start;



	align-content: center;



	align-items: center;

	

	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";

}



#app-top{



	width: 100%;

	height: 60%;


	padding: 0px;

	display: flex;



	flex-direction: column;



	justify-content: flex-start;



	align-content: center;



	align-items: center;



}



#app-bottom{



	width: 90%;

	max-width: 900px;

	height: 20%;


	top: 0;

	padding: 10px;

	display: flex;

	flex-direction:row;

	justify-content: space-around;

	align-content: center;

	align-items: center;

	

	background-color: rgba(256,256,256,0.75);

	border-radius: 10px;

	



}



#options-window{

	width: 80%;

	max-width: 900px;

	background-color: rgba(72,94,75,1);

	border: #a0815c 10px solid;

	border-radius: 20px;

	height: 100%;

	margin-bottom: 5%;

	margin-top: 0px;

	padding: 20px 20px 20px 20px;

	

	flex-direction:column;

	justify-content: flex-start;

	align-content: flex-start;

	align-items: flex-start;

	display: none;

	

}



#game-window{

	width: 90%;

	height: 100%;

	padding: 0px;

	

	flex-direction:column;

	justify-content: flex-start;

	align-content: center;

	align-items: center;

	text-align: center;

	display: none;

	

}



#game-message{

	width: 100%;

	height: 100%;

	padding: 0px;

	flex-direction:column;

	justify-content: center;

	align-content: center;

	align-items: center;

	display: flex;



	

}







#time-out{

	width: 50%;

	height: 100%;

	padding: 20px;

	flex-direction:column;

	justify-content: center;

	align-content: center;

	align-items: center;

	display: none;

	background-color: rgba(255,255,255,.75);



	

}



#wrong{

	width: 100%;

	padding: 0px;

	position: relative;

	margin-top: -200px;

	margin-left: 0;

	

}



#wrong-again{

	width: 80%;

	height: 150px;

	padding: 0px;

	flex-direction:column;

	justify-content: center;

	align-content: center;

	align-items: center;

	text-align: center;

	display: none;

	border-radius: 10px;

	background-color: rgba(255,255,255,.75);

	

}



#wrong-again-button{

	width: 200px;;

	height: 50px;

	padding: 0px;

	line-height: 50px;

	background-color: rgba(99,99,99);

	border-radius: 10px;

	cursor: pointer;

	color: #ffffff;

	font-size: 1.2em;	

}



#wrong-again-button:hover{

	

	background-color: rgba(123,123,123,1);

	

}





#correct{

	width: 100%;

	padding: 0px;

	position: relative;

	margin-top: -200px;

	margin-left: 0;

	

}



#timeup-again{

	width: 200px;;

	margin-top: 30px;

	height: 50px;

	padding: 0px;

	line-height: 50px;

	background-color: rgba(99,99,99);

	border-radius: 10px;

	cursor: pointer;

	color: #ffffff;

	font-size: 1.2em;	

}



#timeup-again:hover{

	

	background-color: rgba(123,123,123,1);

	

}



#game-message img{

	width: 0%;

	padding: 0px;

	border-radius: 10px;

}





#game-top{

	width: 100%;

	height: 50px;

	padding: 5px 0px 5px 0px;

	background-color: rgba(255,255,255,0.95);

	display: flex;

	flex-direction:row;

	justify-content: flex-start;

	align-content: flex-start;

	align-items: flex-start;

	text-align: left;

	

}



#game-main{

	width: 80%;

	padding: 5px 0px 5px 0px;

	margin-top: 10px;

	background-color: rgba(255,255,255,0);

	display: none;

	margin-left: -10%;

	flex-direction:column;

	justify-content: flex-start;

	align-content: center;

	align-items: center;

	text-align: center;

	

}



.game-main-m{

	width: 100% !important;

	margin:10px 0px 0px 0px !important;



	

}



#first-number, #second-number, #result, #line, #number1,#number2{

	width: 100%;

	

	padding: 5px;

	display: flex;

	flex-direction:row;

	justify-content: center;

	align-content: center;

	align-items: center;

	text-align: center;

	

}





#highest-score{

	width: 100%;

	margin-top: -100px;

	height: 100%;

	display: flex;

	flex-direction:column;

	justify-content: center;

	align-content: center;

	align-items: center;

	text-align: center;

	

	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";

	padding-top: 50px;

}





.highest-score-m{



	margin-top: -40px  !important;



}





#highest-score-head-m{

	font-size: 1.1em;

	color:red;

	padding: 20px;

}

#highest-score-number-m{

	font-size: 1.5em;

	color:black;

	font-weight: bold;

}









#first-number img, #second-number img, #result img,#line img{

	max-width: 6%;		

}



#number1 div, #number2 div{

	max-width: 8%;		

}



#numbers{

	width: 100%;

	padding: 20px;

	display: flex;

	flex-direction:column;

	justify-content: center;

	align-content: center;

	align-items: center;

	text-align: center;

	background-color: rgba(255,255,255,.75);

	border-radius: 10px;

	

	

}



.numbers-m{

	

	padding: 10px !important;

	

}



.numbers-m div div{

	max-width: 18% !important;

	

}



#number1 img, #number2 img{

	width: 100%;

}

#number1 div, #number2 div{

	border: 1px #666666 solid;

	background-color: rgba(255,255,255,1);

	border-radius: 10px;

	margin-right: 10px;

	cursor: pointer;

	padding: 10px;

}



#number1 div:hover, #number2 div:hover{

	background-color: #e9e9ff;

}



.numbers-m{

	

}







#game-back-button{

	width: 80px;

	text-align: center;

	border-radius: 10px;

	height: 40px;

	padding: 0px;

	line-height: 40px;

	background-color: rgba(99,99,99);

	cursor: pointer;

	color: #ffffff;

	font-size: 1.2em;	

}



#game-back-button:hover{

	

	background-color: rgba(123,123,123,1);

	

}





#game-score{

	border-radius: 3px;

	height: 40px;

	padding: 0px;

	line-height: 40px;

	color:#666666;

	font-size: 1.2em;

	display: flex;

	flex-direction:row;

	justify-content: center;

	align-content: center;

	align-items: center;

	text-align: center;

}





.game-score-m{

	

	font-size: 0.8em !important;



}



#hi-score{

	border-radius: 3px;

	height: 40px;

	padding: 0px;

	line-height: 40px;

	color:#666666;

	background-color: rgba(255,255,255,0.75);

	font-size: 1.2em;

	flex-direction:row;

	justify-content: center;

	align-content: center;

	align-items: center;

	text-align: center;

	position: absolute;

	display: none;

	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";

}



#game-time{

	width: 100%;

	height: 40px;

	padding: 0px;

	line-height: 40px;

	color:#666666;

	font-size: 1.2em;

	display: flex;

	flex-direction:row;

	justify-content: center;

	align-content: center;

	align-items: center;

	text-align: center;

	margin-left: 100px;

	

	

}





.game-time-m{

	

	font-size: 0.8em !important;

	margin-left: 10px !important;

	

	

}



#game-score-input{

	height: 40px;

	width: 200px;

	padding-left: 10px;

	border:2px #666666 solid;

	border-radius: 10px;

	line-height: 40px;

	color:#000000;

	font-size: 1.5em;

	

	

}



#hi-score-input{

	height: 40px;

	width: 200px;

	padding-left: 10px;

	border:0px;

	border-radius: 3px;

	line-height: 40px;

	color:#000000;

	font-size: 1.5em;

	background-color: rgba(0,0,0,0);

	

	

}



.game-score-input-m{

	height: 40px !important;

	width: 100px !important;

	padding-right: 10px !important;

	font-size: 1.2em !important;

	

	

}



.hi-score-input-m{

	height: 40px !important;

	width: 100px !important;

	padding-right: 10px !important;

	font-size: 1em !important;

	

	

}







#game-time-input{

	height: 40px;

	text-align: center;

	margin: 0px 15px 0px 15px;

	width: 70px;

	border:0px;

	line-height: 40px;

	color:#000066;

	font-size: 1.5em;

	background-color: rgba(0,0,0,0);

	

	

}





#game-time-input-m{

	margin: 0px 5px 0px 5px !important;

	width: 30px !important;

	font-size: 1em !important;

	

	

	

}



#num-digits{

	width: 100%;

	display: flex;

	flex-direction:row;

	justify-content: flex-start;

	align-content: center;

	align-items: center;

}



#time-limit{

	width: 100%;

	display: flex;

	flex-direction:row;

	justify-content: flex-start;

	align-content: center;

	align-items: center;

	margin-top: 40px;

}





#time-limit-times{

	width: 100%;

	display: flex;

	flex-direction:row;

	justify-content: flex-start;

	align-content: center;

	align-items: center;

	flex-wrap: wrap;

}





#inc-carry-options{

	width: 100%;

	display: flex;

	flex-direction:row;

	justify-content: flex-start;

	align-content: center;

	align-items: center;

	flex-wrap: wrap;

}





#inc-carry{

	width: 100%;

	display: flex;

	flex-direction:row;

	justify-content: flex-start;

	align-content: center;

	align-items: center;

	margin-top: 40px;

}



#close-button{

	width: 100%;

	display: flex;

	flex-direction:row;

	justify-content: flex-end;

	align-content: center;

	align-items: center;

	margin-top: 40px;

}







/*







@media only screen and (max-width:460px) {



	.app-mix-input-box{flex-direction: column; font-size: 0.9em;}



	.app-input{	width: 75px; height: 30px;font-size: 0.9em;	padding:1px; line-height: 30px;}



	.app-input-unit{	width: 35px; height: 30px;font-size: 0.9em;	padding:1px; line-height: 30px;}



	.app-input-passive{	width: 75px; height: 30px;font-size: 0.9em;	padding:1px; line-height: 30px;}



	.app-mix-input-box div{line-height: 24px; margin-bottom: 10px;}



	#show-answer{line-height: 24px;}



	.app-mix-input-box div span{width: 100%; height:25px;line-height: 25px;}















}







*/