@charset "utf-8";

@font-face {
	font-family: Rubric;
	font-style: normal;
	font-weight: normal;
	src: url(../__fonts/Cabin-Bold.ttf);
}

@font-face {
	font-family: Ans;
	font-style: normal;
	src: url(../__fonts/Roboto-Regular.ttf);
}

@font-face {
	font-family: Title;
	font-style: normal;
	font-weight: normal;
	src: url(../__fonts/MyriadPro-Semibold_2.otf);
}


body {
	margin: 0px;
	padding: 0px;
	-webkit-user-select: none;
	-moz-user-select: none;
}

div,
input {
	font-variant-ligatures: none;
}

div {
	/*border:#000 dotted 2px;*/
}

#main {
	width: 900px;
	height: 575px;
	/*background:url(../../../../__images/bg.png);
	background-color: #CCC;*/
}


#rubricDiv {
	position: absolute;
	/*width: 1080px;
	//background:#fff;*/
	padding: 10px 10px 10px 10px;
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	font-family: Rubric;
	font-weight: bold;
	color: black;
}

#stage {
	width: 900px;
	height: 575px;
}

#ques {
	cursor: default;
}

.containr {
	position: absolute;
	width: 180px;
	top: 0px;
}

.optionDesign {
	font-family: Ans, sans-serif;
	box-shadow: inset 0px 0px 6px #666;
	border: 3px solid #F29B34;
	border-radius: 5px;
	background: #ffff99;
	padding: 10px;
}





#textBox {
	font-family: Ans, sans-serif;
	display: block;
	border: 3px solid #F29B34;
	background: #fff;
	padding-left: 0px;

}


#optDv {
	font-family: Ans, sans-serif;
	display: block;
	position: absolute;
	border: 3px solid #F29B34;
	background: #FFF;
	padding-left: 0px;


}


.quesDiv {
	display: block;
	position: absolute;
	padding-left: 10px;
	padding-top: 2px;
}

#SnoDiv {
	font-family: Ans, sans-serif;
	display: inline-block;
	position: absolute;
	padding-top: 5px;
	border: 3px solid #F29B34;
	border-radius: 50%;
	background: #FFF;
	text-align: center;
	font-size: 30px;
}

.option {
	text-align: center;
	font-size: 30px;
	display: inline-block;
	cursor: pointer;
	margin-left: 5px;
}

.option-selected {

	text-align: center;
	font-size: 30px;
	display: inline-block;
	cursor: pointer;
	margin-left: 5px;
	color: #2b64ff;

}

.option-right {
	text-align: center;
	font-size: 30px;
	display: inline-block;
	cursor: pointer;
	margin-left: 5px;
	color: #00c100;
}

.option-wrong {
	text-align: center;
	font-size: 30px;
	display: inline-block;
	cursor: pointer;
	margin-left: 5px;
	color: #F00;
}

#submitBtn {
	font-size: 21px;
	font-family: Ans;
	display: block;
	width: 145px;
	/* height: 30px; */
	margin-top: 20px;
	font-weight: bold;
	text-align: center;
	background: -webkit-linear-gradient(#fcfcfc, #bcbcbc);
	background: -o-linear-gradient(#fcfcfc, #bcbcbc);
	background: -moz-linear-gradient(#fcfcfc, #bcbcbc);
	background: linear-gradient(#fcfcfc, #bcbcbc);
	color: #151515;
	cursor: pointer;
	padding: 7px 0 7px 0;
	margin-right: 20px;
	border-radius: 10px;
	border-bottom: 1px solid #9c9999;
	box-shadow: 2px 2px 5px 1px #3e3e3e;
	float: right;
}

#answerBtn {
	font-size: 21px;
	font-family: Ans;
	display: block;
	width: 145px;
	/* height: 30px; */
	margin-top: 20px;
	font-weight: bold;
	text-align: center;
	background: -webkit-linear-gradient(#fcfcfc, #bcbcbc);
	background: -o-linear-gradient(#fcfcfc, #bcbcbc);
	background: -moz-linear-gradient(#fcfcfc, #bcbcbc);
	background: linear-gradient(#fcfcfc, #bcbcbc);
	color: #151515;
	cursor: pointer;
	padding: 7px 0 7px 0;
	margin-right: 20px;
	border-radius: 10px;
	border-bottom: 1px solid #9c9999;
	box-shadow: 2px 2px 5px 1px #3e3e3e;
	float: right;
	display: none;
	visibility:hidden;
}

#checkSolution {
	/* visibility: hidden; */
	position: absolute;
	width: 410px;
	top: 491px;
	left: 214px;
	z-index: 1;
	/* display: flex;
	justify-content: center; */
}

#preNext {
	position: absolute;
	width: 500px;
	height: 50px;

}

.prenxt {
	height: 53px;
	width: 53px;
	cursor: pointer;
	background: -webkit-linear-gradient(#fcfcfc, #bcbcbc);
	background: -o-linear-gradient(#fcfcfc, #bcbcbc);
	background: -moz-linear-gradient(#fcfcfc, #bcbcbc);
	background: linear-gradient(#fcfcfc, #bcbcbc);
	border-radius: 100%;


}


#prev {

	background: url(../../../../__imagess/arrow2.png);
	background-size: 53px 53px;
}

#next {

	background: url(../../../../__images/arrow.png);
	background-size: 53px 53px;
}

.innerQ{
	text-align:left;
	margin:8px 10px 12px 50px;
	text-indent:-30px;
}   
.inClass
{
	border:0;
	outline:none;
	border-bottom:black 2px solid;
	text-align:center;
	font-size:25px;	
	background-color:#FFF;
}
#activityText {
	position: absolute;
	left: 35px;
	top: 57px;
	-webkit-animation-name: activityTextAnim;
	-webkit-animation-duration: 1s;
	animation-name: activityTextAnim;
	animation-duration: 1s;
}

@-webkit-keyframes activityTextAnim {
	0% {
		left: 35px;
		top: -90px;
	}

	50% {
		left: 35px;
		top: 80px;
	}

	100% {
		left: 35px;
		top: 57px;
	}
}


@keyframes activityTextAnim {
	0% {
		left: 35px;
		top: -90px;
	}

	50% {
		left: 35px;
		top: 80px;
	}

	100% {
		left: 35px;
		top: 57px;
	}
}

#completedText {
	position: absolute;
	left: 390px;
	top: 57px;
	-webkit-animation-name: completedTextAnim;
	-webkit-animation-duration: 1s;
	animation-name: completedTextAnim;
	animation-duration: 1s;
}


@-webkit-keyframes completedTextAnim {
	0% {
		left: 390px;
		top: 202px;
	}

	50% {
		left: 390px;
		top: 32px;
	}

	100% {
		left: 390px;
		top: 57px;
	}
}


@keyframes completedTextAnim {
	0% {
		left: 390px;
		top: 202px;
	}

	50% {
		left: 390px;
		top: 32px;
	}

	100% {
		left: 390px;
		top: 57px;
	}
}

.inClass,
.inClass:focus,
.disa,
.disa:focus,
.txtformat,
.txtformat:focus {
	-webkit-user-select: text;
	/* Chrome, Opera, Safari */
	-moz-user-select: text;
	/* Firefox 2+ */
	-ms-user-select: text;
	/* IE 10+ */
	user-select: text;
	/* Standard syntax */
	margin: 0 !important;
	padding: 0 !important;
	border-radius: 0 !important;
}

#scorePanel {
	position: absolute;
	top: 1px;
	left: 725px;
	font-family: Ans, sans-serif;
	font-size: 20px;
	background-color: #312122;
	border-radius: 8px;
	padding: 10px;
	color: #fff;
}
#Reset {
	font-size: 21px;
	font-family: Ans;
	display: block;
	width: 145px;
	/* height: 30px; */
	margin-top: 20px;
	font-weight: bold;
	text-align: center;
	background: -webkit-linear-gradient(#fcfcfc, #bcbcbc);
	background: -o-linear-gradient(#fcfcfc, #bcbcbc);
	background: -moz-linear-gradient(#fcfcfc, #bcbcbc);
	background: linear-gradient(#fcfcfc, #bcbcbc);
	color: #151515;
	cursor: pointer;
	padding: 7px 0 7px 0;
	margin-right: 20px;
	border-radius: 10px;
	border-bottom: 1px solid #9c9999;
	box-shadow: 2px 2px 5px 1px #3e3e3e;
	float: right;
	visibility: hidden;
}