* {
	direction: rtl;
	text-align: center;
	color: white;
	font-size: 17px;
	font-family: 'Arimo';
}
body {
	background-image: url(../img/wooden-bg.jpg);
}
#main_container {
	background-color: rgba(255, 255, 255, 0.2);
	border: 1px white solid;
	margin: auto;
	width: 60%;
	padding: 1%;
}
.header_question--container_btn {
	display: inline-block;
	width: 100%;
	margin-top: 10px;
}
.btn.question_type {
	display: inline-block;
	margin-bottom: 5px;
	background-color:#fd5043;
	color: white;
	cursor: default;
	text-shadow: 0px 0px 5px #000;
}
.btn.question_counter {
	display: inline-block;
	margin-bottom: 5px;
	cursor: default;
}

#timer {
	background-color: #fd5043;
	color: white;
	cursor: default;
	text-shadow: 0px 0px 5px #000;
}
.header_question--question_information {
	/* display: inline-block; */
}
#question_type {
	/* color: red; */
}
.question {
	margin: 2%;
}
.image_container {
	cursor: pointer;
	margin-bottom: 15px;
	width: 93%;
	margin: 10px auto;
}
.image_exam {
	width: 95%;
}
.information_container {
	list-style-type: none;
	padding: 0;
	margin: auto;
	width: 93%;
}
.btn.information {
	display: block;
	margin: 2%;
	white-space: pre-wrap;

}
/* .answer {
	color: white;
	text-align: right;
	padding: 2%;
	margin-bottom: 10px;
	cursor: pointer;
	border-color: #444;
	border-style: solid;
	border-width: 1px;
	box-shadow: 0px 0px 10px #000;
	flex-direction: row-reverse;
	opacity: 0.6;
	transition: 0.3s ease-in-out;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: ease-in-out;
	transition-delay: 0s;
}
.answer:hover {
	opacity: 1;
	transition: 0.3s ease-in-out;
	transition-property: all;
	transition-duration: 0.3s;
	transition-timing-function: ease-in-out;
	transition-delay: 0s;
} */
.btn_container {
	margin: 15px 0;
}
.btn {
	display: inline-block;
	padding: 5px 12px;
	line-height: 20px;
	border-radius: 10px;
	color: #11294a;
	background-color: #a2c6e7;
	cursor: pointer;
	margin: 0 1%; 
	white-space: nowrap;
	box-shadow: 0px 0px 10px #000;
}
.btn.btn--disable {
	pointer-events: none;
}
#prev_question {
	background-color:#fd5043;
	text-shadow: 0px 0px 5px #000;
	color: white;
}
#next_question {
	background-color:#fd5043;
	text-shadow: 0px 0px 5px #000;
	color: white;
}

.alert {
	background-color: red;
}
#exam_stats_chart {
	/* direction: ltr;
	margin: auto; */
}

.btn.information.grade_total_question{
	display: inline-block;
	font-size: 22px;

}
.result_total_question{
	/* background-color: ; */
}

.wrong_total_question{
	background-color: #fd5043;
	cursor: default;
	text-shadow: 0px 0px 5px #000;
	color: white;
}
.rigth_total_question{
	background-color: #1e9119;
	cursor: default;
	text-shadow: 0px 0px 5px #000;
	color: white;
}

.answer_wrong {
	color: #e53f3f;
	font-weight: bold;
	border-color: red;
	background-color: rgba(243, 134, 129, 0.4);
}
.answer_wrong::after {
	content: url(../img/wrong-style-1.png);
}
.answer_rigth {
	color: #74a923;
	font-weight: bold;
	border-color: green;
	background-color: rgba(39, 174, 96, 0.4);
}
.answer_rigth::after {
	content: url(../img/correct-style-1.png);
}

.no_selection {
	user-select: none; /* standard syntax */
	-webkit-user-select: none; /* webkit (safari, chrome) browsers */
	-moz-user-select: none; /* mozilla browsers */
	-khtml-user-select: none; /* webkit (konqueror) browsers */
	-ms-user-select: none; /* IE10+ */
}
#chart tspan {
	font-size: 50px;
	text-shadow: 0px 0px 10px #000;
}
/* Media Queries! */

@media (min-width: 320px) and (max-width: 480px){
	/* smartphones, iPhone, portrait 480x320 phones */
	* {
		font-size: 22px;
	}
	#main_container {
		width: 95%;
	}
	.btn {
		/* width: 27%;  */
	}
	.btn_width_fixer {
		/* width: 43%; */
		font-size: 18px; 
	}
}

@media (min-width: 481px) and (max-width: 640px) {
	/* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */
	#main_container {
		width: 90%;
	}
}
@media (min-width: 641px) {
	/* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */
}
@media (min-width: 961px) {
	/* tablet, landscape iPad, lo-res laptops ands desktops */
}
@media (min-width: 1025px) {
	/* big landscape tablets, laptops, and desktops */
}
@media (min-width: 1281px) {
	/* hi-res laptops and desktops */
}