@charset "utf-8";
/* CSS Document */

body {
	margin-left:0px;
	margin-top:0px;
	margin-right:0px;
	margin-bottom:0px;
	background:#00b0ef ;
	padding:0px 0px 0px 0px;
	width:400px;
}

nav#navMenue{ 
	text-align: center;
}

button.menuBtn {
	width:auto;
	-webkit-trasition:all .2s;
	height:34px;
	font-size: 17px;
	font-weight:bold;
	background-color:#9999CC;
	color:#2f5020;
	margin-right:2px;
	margin-left:2px;
	margin-top:5px;
	margin-bottom:7px;
	border-radius:3px;
	box-shadow:1px 0px 6px rgba(0,0,0,0.3),
				10px 2px 7px rgba(0,0,0,0.9);
	cursor:pointer;
}

button.menuBtn:hover {
	background: #9999FF;
	color:#2f5020;
}













div#wrapper {
	background-color:#1c2cdc;
	width:386px;
	height:auto;
	margin-right:auto;
	margin-left:auto;
	text-align: center;
	border-radius:10px;
	padding:1px 5px 1px 5px;
}

div#endMsg {
	background-color:#ccfcdc;
	border-radius:10px;
}

div#quiz_status {
	width: auto;
	background-color:#a0d0a0;
	height: 36px;
	font-size: 27px;
	font-weight:bold;
	margin-right:auto;
	margin-left:auto;
	margin-top:5px;
	margin-bottom:11px;
	border-radius:10px;
	box-shadow:3px 3px 7px rgba(0,0,0,0.9),
				4px 4px 10px rgba(0,0,0,0.3);
}

div#quiz {
	border:#000 2px solid;
	background-color:#dff0d0;
	width:auto;
	height: 75px;
	font-size: 55px;
	font-weight:bold;
	margin-top:2px;
	margin-bottom:2px;
	margin-right:auto;
	margin-left:auto;
	border-radius:10px;
	box-shadow:3px 3px 7px rgba(0,0,0,0.9),
				4px 4px 10px rgba(0,0,0,0.3);
}

#myProgress {
	width: auto;
	height: 10px;
	border:#000 2px solid;
/*	background-color: #4CCF50;	*/
	background-color: #0CCF50;
	padding:0px 0px 0px 0px;
	margin-right:5px;
	margin-left:5px;
	margin-top:2px;
	margin-bottom:2px;
	border-radius:6px;
	box-shadow:2px 2px 5px rgba(0,0,0,0.9),
				3px 3px 7px rgba(0,0,0,0.3);
}

#myBar {
	background-color: #4CCF50;
	width: 1%;
	height: 10px;
	font-size: 10px;
	text-align:left;
	border-radius:4px;
}

div#an1 {
	width:auto;
	height:75px;
	margin-right:auto;
	margin-left:auto;
	margin-top:1px;
	margin-bottom:1px;
}

div#an2 {
	width:auto;
	height:75px;
	margin-right:auto;
	margin-left:auto;
	margin-top:1px;
	margin-bottom:1px;
}

div#an3 {
	width:auto;
	height:75px;
	margin-right:auto;
	margin-left:auto;
	margin-top:1px;
	margin-bottom:1px;
}

div#an4 {
	width:auto;
	height:75px;
	margin-right:auto;
	margin-left:auto;
	margin-top:1px;
	margin-bottom:1px;
}

button#answer{
	width:296px;
	-webkit-trasition:all .2s;
	height:68px;
	font-size: 40px;
	font-weight:bold;
	background-color:#ffd0d0;
	margin-right:auto;
	margin-left:auto;
	margin-top:2px;
	margin-bottom:2px;
	border-radius:12px;
	box-shadow:1px 0px 6px rgba(0,0,0,0.3),
				10px 2px 7px rgba(0,0,0,0.9);
	cursor:pointer;
}

button#answer:hover {
	background: #ffa0a0;
	color:#2f5020;
}

div#time_diff {
	width: auto;
	background-color:#a0d0a0;
	height: 36px;
	font-size: 27px;
	font-weight:bold;
	margin-right:auto;
	margin-left:auto;
	margin-top:10px;
	margin-bottom:5px;
	border-radius:10px;
	box-shadow:3px 3px 7px rgba(0,0,0,0.9),
				4px 4px 10px rgba(0,0,0,0.3);
}

/* css for home page */
