@import url('css/bootstrap.min.css');
@font-face{
	font-family: mitra;
	src:url('fonts/bmitra.ttf');
}
body{
	background-color: #f5dbf7;
	margin-top: 20px;
	direction: rtl;
	font-family: mitra;
	font-size: 20px;
}
#q{
	padding: 20px;
	font-size: 22px;
	margin: 40px;
}
#start{
	width: 90px;
	font-weight: bold;
	font-size: 24px;
	color:white;
	margin-bottom: 50px;
}
.main{
	background-color: #fff;
	margin-top: 90px;
	width:650px;
	border: 1px solid #5e037c;
	border-radius: 7px;
	padding:20px;
}
#yes{
	width: 110px;
	height: 35px;
	font-weight: bold;
	font-size: 22px;
}
#no{
	width: 110px;
	height: 35px;
	font-weight: bold;
	font-size: 22px;
}
#timer{
	width: 180px;
	height: 32px;
	border: 1px dotted #5e037c;
	float: left;
	color: #5e037c;
	background-color: #f5dbf7;
}
#ltime{
	float: right;
	width: 160px;
	height: 32px;
	color: #5e037c;
	border: 1px dotted #5e037c;
	background-color: #f5dbf7;
}
#correct{
	float: right;
	width: 160px;
	height: 32px;
	color: #5e037c;
	border: 1px dotted #5e037c;
	background-color: #f5dbf7;
	margin-right: 50px;
}
#btn1{
	margin-left: 40px;
	float: left;
	margin-bottom: 50px;
}
#btn2{
	margin-right: 40px;
	float: right;
	margin-bottom: 50px;
}
#return{
	color:white;
	margin-top: 40px;
}
.t{
	color: #5e037c;
	font-size: 22px;
}
.about{
	font-size: 15px;
}
small{
	font-size: 15px;
}
@media screen and (max-width: 500px){
    .main{
        width: 100% !important;
    }
    #timer{
        float: none;
        margin: 0 auto;
    }
}