/*
Copyright Interactive Services 2013 - 2019 All Rights Reserved.  
No part of this code may be used, with or without modification, without prior consent from Interactive Services. 
Chameleon Gold Version 2.3, 01 May 2020
*/

/****************************************************************************/
/* Common elements on question screens																			*/
/****************************************************************************/
.btnStyle1{
	display: inline-block;
	min-width: 200px;
	max-width: 100%;
	width: auto;
	height: 40px;
	line-height: 34px !important;
	padding-left: 10px;
	padding-right: 40px;
	cursor: pointer;
	border-radius: 6px;
	background-image: url(../framework_images/question_images/submit_btn_icon.png);
	/*background-position: right 15px center; :::: This breask on Edge */
	background-position: 93% center;
	background-repeat: no-repeat;
	
	-webkit-transition: background-position 0.5s ease-out;
		 -moz-transition: background-position 0.5s ease-out;
		   -o-transition: background-position 0.5s ease-out;
					transition: background-position 0.5s ease-out;
}

#wrapper.inverseColors .btnStyle1{
	background-image: url(../framework_images/question_images/submit_btn_icon_grey.png);
}

.btnStyle1.darkBtn{
	background-image: url(../framework_images/question_images/submit_btn_icon_grey.png);
}

#wrapper.inverseColors .btnStyle1.darkBtn{
	background-image: url(../framework_images/question_images/submit_btn_icon.png);
}

.btnStyle1.disabled{
	background-color: rgb(202, 202, 202);
	background-color: rgba(202, 202, 202, 0.36);
	opacity: 0.5;
	cursor: default;
}

.btnStyle1.centerBtn{
	margin-right: auto;
	margin-left: auto;
}

body:not(.touch_device)  #qiToggle{
	/*background-position: right 10px center; :::: This breask on Edge */
	height: auto;
}

body:not(.touch_device)  .btnStyle1:not(.disabled):hover{
	/*background-position: right 10px center; :::: This breask on Edge */
	background-position: 97% center;
}

.btnStyle1.wideStyle,.btnStyle3.wideStyle{
	width: 300px;
}

body.rtl .btnStyle1{
	position: relative;
	padding-left: 40px;
	padding-right: 10px;
	background-size: 0px;
}

body.rtl .btnStyle1:before{
	content:"";
	position: absolute;
	top: 7px;
	left: 10px;
  width: 15px;
  height: 20px;
  background-image: inherit;
	background-repeat: no-repeat;
	
	-webkit-transform: scaleX(-1);
		 -moz-transform: scaleX(-1);
		   -o-transform: scaleX(-1);
					transform: scaleX(-1);
					
	-webkit-transition: left 0.5s ease-out;
		 -moz-transition: left 0.5s ease-out;
		   -o-transition: left 0.5s ease-out;
					transition: left 0.5s ease-out;
}

body.rtl:not(.touch_device)  .btnStyle1:hover:not(.disabled):before{
	left: 3px;
}

.btnStyle2{
	display: inline-block;
	background-color: transparent;
	min-width: 200px;
	width: auto;
	height: 40px;
	line-height: 36px !important;
	text-align: center;
	/*color: #fff;*/
	border-width: 2px;
	padding: 0px 40px 0px 20px;
	border-radius: 6px;
	background-image: url(../framework_images/question_images/submit_btn_icon.png);
	background-position: right 15px center;
	background-repeat: no-repeat;
	cursor: pointer;
	
	
	
	-webkit-transition: background-position 0.5s ease-out;
		 -moz-transition: background-position 0.5s ease-out;
			-ms-transition: background-position 0.5s ease-out;
		   -o-transition: background-position 0.5s ease-out;
					transition: background-position 0.5s ease-out;
}

#wrapper.inverseColors .btnStyle2{
	background-image: url(../framework_images/question_images/submit_btn_icon_grey.png);
}

.btnStyle2.darkBtn{
	background-image: url(../framework_images/question_images/submit_btn_icon_grey.png);
}

#wrapper.inverseColors .btnStyle2.darkBtn{
	background-image: url(../framework_images/question_images/submit_btn_icon.png);
}

body:not(.touch_device)  .btnStyle2:not(.disabled):hover{
	background-position: right 10px center;
}

.btnStyle2.disabled{
	opacity: 0.5;
	cursor: default;
}

.btnStyle2.centerBtn{
	display: block;
	width: 200px;
	margin-right: auto;
	margin-left: auto;
}

.btnStyle3{
	display: inline-block;
	background-color:rgb(247, 140, 34);
	min-width: 200px;
	width: auto;
	height: 40px;
	line-height: 40px !important;
	text-align: center;
	color: #fff;
	padding: 0px 40px 0px 20px;
	border-radius: 6px;
	background-image: url(../framework_images/question_images/submit_btn_icon.png);
	background-position: right 15px center;
	background-repeat: no-repeat;
	cursor: pointer;
	
	
	-webkit-transition: background-position 0.5s ease-out;
		 -moz-transition: background-position 0.5s ease-out;
			-ms-transition: background-position 0.5s ease-out;
		   -o-transition: background-position 0.5s ease-out;
					transition: background-position 0.5s ease-out;
}

.btnStyle3.darkBtn{
	background-image: url(../framework_images/question_images/submit_btn_icon_grey.png);
}
/*
#wrapper.inverseColors .btnStyle3{
	background-image: url(../framework_images/question_images/submit_btn_icon_grey.png);
}

#wrapper.inverseColors .btnStyle3.darkBtn{
	background-image: url(../framework_images/question_images/submit_btn_icon.png);
}*/

.btnStyle3.disabled{
	background-color: rgb(247, 140, 34);
	background-color: rgba(247, 140, 34, 0.36);
	cursor: default;
}

.btnStyle3.centerBtn{
	margin-right: auto;
	margin-left: auto;
}

body:not(.touch_device)  .btnStyle3:not(.disabled):hover{
	background-position: right 10px center;
	/*background-color: #F5A82F;*/
}

.fullScreenStyle1{
	background-color: #066964;
	border: 3px solid #fff;
	width: 231px;
	height: 40px;
	line-height: 34px !important;
	text-align: center;
	cursor: pointer;
	border-radius: 8px;
	
	-webkit-transition: background-color .5s;
		 -moz-transition: background-color .5s;
			-ms-transition: background-color .5s;
			 -o-transition: background-color .5s;
					transition: background-color .5s;
}

.fullScreenStyle1.disabled{
	background-color: rgb(48, 77, 94);
	background-color: rgba(48, 77, 94, 0.36);
	cursor: default;
}

body:not(.touch_device) .fullScreenStyle1:not(.disabled):hover{
	color: #066964;
	background-color: #fff;
	border: 3px solid #066964;
}

.flipbackbtn{
	display: none;
	position: absolute;
	top: 15px;
	right: 25px;
	width: 41px;
	height: 41px;
	
	background-position: center center;
	background-repeat: no-repeat;
	
	cursor: pointer;
	z-index: 5;
}

.flipbackbtn.whiteFlipBtn, #wrapper.inverseColors .flipbackbtn{
	background-image: url(../framework_images/question_images/feedback_toggle_white.png);
}

#wrapper.inverseColors .flipbackbtn.whiteFlipBtn, .flipbackbtn{
	background-image: url(../framework_images/question_images/feedback_toggle.png);
}

.flipHolder.flipReady .flipbackbtn{
	display: block;
}

body.rtl .flipbackbtn{
	right: initial;
	right: auto;
	left: 25px;
}

body.showScenarioGUI.gui_top.xl .flipbackbtn, body.showScenarioGUI.gui_top.lg .flipbackbtn, body.showScenarioGUI.gui_top.md .flipbackbtn{
	top: 55px;
}

.qImgCircle{
	display: block;
	margin: 20px auto;
	max-width: 135px;
}

.paddedText{
	padding: 20px;
}

.paddedText_10{
	padding: 10px;
}

.promptPadding{
	padding: 0px 15px 40px 15px;
}

#wrapper .largeIndicatorPadding{
	padding: 20px 40px 20px 120px;
}

body.rtl #wrapper .largeIndicatorPadding{
	padding: 20px 120px 20px 40px;
}

/****************************************************************************/
/* Flip Panel elements																											*/
/****************************************************************************/
.questionStemPanelFront{
	height: auto;
	
	-webkit-transition: all .5s;
		 -moz-transition: all .5s;
			-ms-transition: all .5s;
			 -o-transition: all .5s;
					transition: all .5s;
}

.flipQuestionPanel.bottomAlignPanel .questionStemPanelFront{
	border-radius: 20px;
	padding: 30px;
	padding-right: 40px;
}

.flipHolder.flipReady .questionStemPanelFront{
	padding-top: 55px;
}

.flipQuestionPanel.bottomAlignPanel .questionStemPanelBack{
	border-radius: 20px;
	background-position: 30px 30px;
  padding: 210px 30px 30px 30px;
}

.questionStemPanelFront.fullScreenWhitePanel, .questionStemPanelBack.fullScreenWhitePanel{
	padding: 30px;
	height: 100%;
	border-width: 7px;
}

.questionStemPanelFront.fullScreenClearPanel{
	margin: 0px 24px;
	padding: 20px 0px;
	height: 100%;
}


@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
	.questionStemPanelFront{
		transition: all 0s;
	}
}

.rateQuestionStemPanelFront{
	height: auto;
	width: 100%;
	padding-right: 20px;
	padding-left: 20px;
}

.grid .questionStemPanelFront,
.grid .questionStemPanelBack {
	background-color: rgba(243, 152, 8, 0.9);
}

.questionStemPanelBack{
	position: relative;
	height: auto;
}


.questionStemPanelBack.ratePanelBack{
	height: auto;
	width: 100%;
	padding: 20px;
	background-color: transparent;
}

.flipstem{
	padding-right:45px;
}

.middle.flipQuestionPanel {
	top: 30%;
}

.flipQuestionPanel{
	width: 100%;
}

.flipQuestionPanel.bottomAlignPanel{
	position: absolute;
	bottom: 30px;
	width: calc(100% - 150px);
	margin: 0px 120px 0px 30px;
}

body.showScenarioGUI.gui_bottom .flipQuestionPanel.bottomAlignPanel{
	bottom: 70px;
}

body.rtl .screenSlide:not(.curSlide) .flipQuestionPanel.bottomAlignPanel{
	bottom: initial;
	bottom: auto;
	top: -1000px;
}

body.rtl .flipQuestionPanel.bottomAlignPanel{
	margin: 0px 30px 0px 120px;
}

.flipQuestionPanel.fill{
	overflow: hidden;
}

.flipQuestionPanel div.label_txt_2{
	word-wrap: break-word;
}

.flipQuestionPanel.rateFlipPanel{
	width: 100%;
	margin: 0px;
	padding: 0px;
}

.flipQuestionPanel.rateFlipPanel .flipbackbtn{
	right: 40px;
}

.questionStemPanel{
	position: absolute;
	bottom: 0px;
	height: auto;
	width: auto;
	padding: 20px;
	background-color: rgb(243, 152, 8);
	background-color: rgba(243, 152, 8, 0.9);
	margin: 20px;
}

.questionStemPanel.clearQuestionPanel{
	background-color: transparent;
}

.flipQuestionPanel.middle {
  position: relative;
	margin: 3em;
	margin-top: 33%;
	top: 100px;
	position: relative;
	width: auto;
	left: 0px;
}

.flipQuestionPanel.middle .questionStemPanelFront {
	width:100%;
}

.question_correct_label{
	display: none;
	margin-top: 20px;
	padding-bottom: 11px;
	border-bottom: 2px solid #000;
	margin-bottom: 10px;
}

.question_incorrect_label{
	display: none;
	margin-top: 20px;
	padding-bottom: 11px;
	border-bottom: 2px solid #000;
	margin-bottom: 10px;
}

.qiFeedback.partically_retry .question_incorrect_label, .qiFeedback.incorrect .question_incorrect_label, .qiFeedback.retry .question_incorrect_label, .qiFeedback.partically .question_incorrect_label, .qiFeedback.correct .question_correct_label{
	display: block;
}

.screenSlide.fadeover_white:before {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	content:"";
	display:block;
	background-color:rgba(255,255,255,0.7);
	opacity:0;
	transition:opacity 0.4s;
}

.screenSlide.fadeover_white.curSlide:before {
	opacity:1;
}
/****************************************************************************/
/* Option Settings for various screen types																	*/
/****************************************************************************/
.qi_optionsHolder .qiOpt{
	position: relative;
	text-align: center;
	border-radius: 15px;
	min-height: 70px;
	margin: 0px 0px 25px 0px;
	padding: 10px 10px 60px 10px;
	box-shadow: 2px 2px 7px transparent;
	cursor: pointer;
	
	-webkit-transition: all 0.2s ease-in-out;
		 -moz-transition: all 0.2s ease-in-out;
		   -o-transition: all 0.2s ease-in-out;
					transition: all 0.2s ease-in-out;
					
}

.qi_optionsHolder .qiOpt.longOption{
	padding: 13px 10px 13px 65px;
	min-height: 70px;
	text-align: left;
	margin-bottom: 10px;
}

body.rtl .qi_optionsHolder .qiOpt.longOption{
	padding: 13px 65px 13px 10px;
	text-align: right;
}

.qi_optionsHolder .qiOpt.mcBlock{
	border-width: 2px !important;
	background-color: transparent;
}

.qi_optionsHolder .qiOpt.simpleQuestion{
	padding: 13px 10px 13px 65px;
	margin-bottom: 10px;
	min-height: 70px;
	text-align: left;
	border-width: 2px !important;
	background-color: transparent;
}

body.rtl .qi_optionsHolder .qiOpt.simpleQuestion{
	padding: 13px 65px 13px 10px;
	text-align: right;
}

.qi_optionsHolder .qiOpt.mcBubble{
	position: relative;
	opacity: 0;
	padding: 13px 10px 60px 10px;    
	margin: 0px 0px 35px 0px;
	min-height: 70px;
	text-align: center;
	border: none;
}

.qi_optionsHolder .qiOpt.mcBubble:hover {
}

.qi_optionsHolder .qiOpt.mcBubble::after{
	position: absolute;
	bottom: -39px;
	left: 50%;
	border: solid transparent;
	border-top-color: inherit;
	content: " ";
	height: 0;
	width: 0;
	border-width: 20px;
	margin-left: -20px;
	
	-webkit-transition: all 0.2s ease-in-out;
		 -moz-transition: all 0.2s ease-in-out;
			-ms-transition: all 0.2s ease-in-out;
		   -o-transition: all 0.2s ease-in-out;
					transition: all 0.2s ease-in-out;
}

.qi_optionsHolder .qiOpt.mcPanel{
	width: 200px;
	height: auto;
	min-height: 150px;
	padding: 60px 0px 0px 0px;
	margin: 0px 0px 35px 0px;
	border: 3px solid #fff;
	text-align: center;
	background-color: transparent;
	
	/*background-image: url(../framework_images/multislide_images/ms_option_question_mark.png);
	background-position: center center;
	background-repeat: no-repeat;*/
	overflow: hidden;
}

.qi_optionsHolder .qiOpt.mcPanel.selected {
	box-shadow: 10px 10px 10px 0px rgba(0,0,0,0.3);
}

.qi_optionsHolder .qiOpt.mcPanel.indicatorCorrect, .qi_optionsHolder .qiOpt.mcPanel.indicatorIncorrect{
	background-image: none;
}

.qi_optionsHolder .qiOpt.mcPanel.indicatorCorrect .qiOptIndicator, .qi_optionsHolder .qiOpt.mcPanel.indicatorIncorrect .qiOptIndicator{
	display: block;
}

.qi_optionsHolder .qiOpt.mcPanel .qiOptIndicator{
	display: none;
	top: 0px;
	left: 50%;
	margin-top: 0px;
	
  -webkit-transform: perspective(1px) translateX(-50%);
  	 -moz-transform: perspective(1px) translateX(-50%);
  		 -o-transform: perspective(1px) translateX(-50%);
 				  transform: perspective(1px) translateX(-50%);
}

.qi_optionsHolder .qiOpt.mcPanel.disabled.selected {
	border: 0px;
	 -webkit-transform: scale(1.1);
	 		-moz-transform: scale(1.1);
	 			-o-transform: scale(1.1);
	 				 transform: scale(1.1);
}

.qi_optionsHolder .qiOpt.mcPanel.disabled:not(.selected){
	 -webkit-transform: scale(0.8);
	 		-moz-transform: scale(0.8);
	 			-o-transform: scale(0.8);
	 				 transform: scale(0.8);
}

/****************************************************************************************/

.qi_optionsHolder .qiOpt.ictDark{
	padding: 60px 10px 10px 10px;
	/*background-image: url(../framework_images/question_images/ictDark_bg.png);*/
	background-position: top left;
	background-repeat: repeat;
	/*background-color: rgba(0,0,0,0.6);*/
	border-radius: 10px;
	border: 2px solid transparent;
	box-shadow: none !important;
}

.qi_optionsHolder .qiOpt.ictDark.selected{
	background-image: url(../framework_images/question_images/ictDark_bg.png);
	border-width: 2px;
}

.qi_optionsHolder .qiOpt.ictDark.longOption{
	padding: 13px 10px 13px 65px;
	min-height: 70px;
	text-align: left;
	margin-bottom: 10px;
}

body.rtl .qi_optionsHolder .qiOpt.ictDark.longOption{
	padding: 13px 65px 13px 10px;
	text-align: right;
}

.qi_optionsHolder .qiOpt.ictDark:hover {
}

.qi_optionsHolder .qiOpt.ictSquare{
	padding: 60px 10px 10px 10px;
	border-radius: 10px;
	border: 1px solid transparent;
}

.qi_optionsHolder .qiOpt.ictSquare.longOption{
	padding: 13px 10px 13px 65px;
	min-height: 70px;
	text-align: left;
	margin-bottom: 10px;
	box-shadow: none !important;
	border-radius: 0px;
	border-width: 0px;
}

body.rtl .qi_optionsHolder .qiOpt.ictSquare.longOption{
	padding: 13px 65px 13px 10px;
	text-align: right;
}

.qi_optionsHolder .qiOpt.ictSquare:hover {
}

.qi_optionsHolder .qiOpt.ictWhite{
	border-radius: 10px;
	padding: 13px 10px 13px 65px;
	min-height: 70px;
	text-align: left;
	margin-bottom: 10px;
	box-shadow: none !important;
	border-width: 2px;
}

body.rtl .qi_optionsHolder .qiOpt.ictWhite{
	padding: 13px 65px 13px 10px;
	text-align: right;
}

.simpleFeedbackHolder:not(.padding_none){
	padding: 0px 30px;
}

.qi_optionsHolder .qiOptIcon{
	position: relative;
	margin: 0px 0px 0px 0px;
	min-height: 50px;
	background-image: url(../framework_images/question_images/mcBlocks_icon.png);
	background-position: center center;
	background-repeat: no-repeat;	
	background-size: contain;			
}

.qi_optionsHolder .qiOptGraphical {
	border-radius: 5px;
	padding: 0px;
	max-width: 400px;
	margin: 0px auto 25px auto;
}

.qiGraphicalImg{
	margin: 0px;
	width: 100%;
	height: auto;
}
	        

#matchingGraphicalItems.qi_optionsHolder .qiOptIcon{
	min-height: 175px;
}

body:not(.touch_device) .qi_optionsHolder .qiOpt:not(.disabled):hover {
	 -webkit-transform: scale(1.02);
	 		-moz-transform: scale(1.02);
	 		 -ms-transform: scale(1.02);
	 			-o-transform: scale(1.02);
	 				 transform: scale(1.02);
	 				 
	box-shadow: 3px 3px 8px 1px rgba(0,0,0,0.3);
}

.qi_optionsHolder .qiOpt.selected {
	box-shadow: 2px 2px 7px  rgba(0,0,0,0.3);
}

.qiOptIndicator{
	position: absolute;
	top: 50%;
	left: 10px;
	margin-top: -23px;
	height: 46px;
	width: 46px;
	background-position: center center;
	background-repeat: no-repeat;

	-webkit-transition: background-image 0.5s ease-in-out;
		 -moz-transition: background-image 0.5s ease-in-out;
			-ms-transition: background-image 0.5s ease-in-out;
		   -o-transition: background-image 0.5s ease-in-out;
					transition: background-image 0.5s ease-in-out;
}

body.rtl .qiOptIndicator:not(.bottom):not(.top){
	left: initial;
	left: auto;
	right: 10px;
}

body:not(.heIL).rtl .qiOpt:not(.indicatorCorrect):not(.indicatorIncorrect) .qiOptIndicator{
	-webkit-transform: scaleX(-1);
		 -moz-transform: scaleX(-1);
		   -o-transform: scaleX(-1);
					transform: scaleX(-1);
}

body:not(.heIL).rtl .qiOpt .qiOptIndicator{
	-webkit-transition: none !important;
  	 -moz-transition: none !important;
  		 -o-transition: none !important;
  				transition: none !important;
}

.qiOptIndicator.bottom {
	top: auto;
	top: initial;
	right: auto;
	right: initial;
	bottom: 10px;
	left: 50%;
	margin-left: -23px;
}

.qiOptIndicator.top {
	top: 10px;
	left: 50%;
	margin-left: -23px;
	margin-top: 0px;
}



.vi_question_panel .qi_optionsHolder .qiOpt{
	text-align: left;
	padding: 16px 10px 0px 50px;
	margin: 0px 0px 10px 0px;
	border-radius: 10px;
	border: 2px solid #fff;
	background-color: #000;
	cursor: pointer;
}

body.rtl .vi_question_panel .qi_optionsHolder .qiOpt{
	padding: 16px 50px 0px 10px;
	text-align: right;
}

.vi_question_panel .qi_optionsHolder .qiOptIndicator{
	top: 50%;
	left: 0px;
	bottom: auto;
	bottom: initial;
	margin-top: -32px;
}

.qi_optionsHolder.viQuestion{
	padding-left: 20px;
	padding-top: 20px;
}

body.xs #wrapper.tq_mc_core_image #qiSubmit, body.xs #wrapper.tq_grid #qiSubmit{
	margin-bottom: 30px;
}

/*********************************************************************/
/**************************** FLIP OPTION ****************************/
/*********************************************************************/
.qi_optionsHolder .qiOpt.flipPanel{
	float: right;
	position: relative;
	width: 340px;
	min-height: 165px;
	background-color: transparent !important;
	cursor: pointer;
  
	-webkit-transform-style: preserve-3d;
		 -moz-transform-style: preserve-3d;
			 -o-transform-style: preserve-3d;
					transform-style: preserve-3d;
}

.qi_optionsHolder .qiOpt.flipPanel.selected{
	box-shadow: none;
}

body:not(.rtl) .qi_optionsHolder > div:nth-child(even) .qiOpt.flipPanel, body.rtl .qi_optionsHolder > div:nth-child(odd) .qiOpt.flipPanel{
	float: left;
}

.qi_optionsHolder .qiOpt.flipPanel .flipPanelBack .qiOptIndicator{
	top: 0px;
	left: 50%;
	margin-top: 0px;
	
  -webkit-transform: perspective(1px) translateX(-50%);
  	 -moz-transform: perspective(1px) translateX(-50%);
  		 -o-transform: perspective(1px) translateX(-50%);
 				  transform: perspective(1px) translateX(-50%);
}

body.rtl .qi_optionsHolder .qiOpt.flipPanel .flipPanelBack .qiOptIndicator{
	right: auto;
	right: initial;
}

.qi_optionsHolder .qiOpt.flipPanel .baseFlipPanel{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 340px;
	min-height: 165px;
	padding: 65px 0px 0px 0px;
	margin: 0px 0px 35px 0px;
	border: 3px solid #fff;
	border-radius: 15px;
	text-align: center;
	overflow: hidden;
  
	-webkit-backface-visibility: hidden;
		 -moz-backface-visibility: hidden;
			 -o-backface-visibility: hidden;
					backface-visibility: hidden;
	
	-webkit-transition: 0.5s;
		 -moz-transition: 0.5s;
			 -o-transition: 0.5s;
					transition: 0.5s;
}

body:not(.ie10) .qi_optionsHolder .qiOpt.flipPanel .flipPanelFront:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	height: 0px;
	width: 0px;
	border-radius: 50%;
	z-index: -1;
	
	-webkit-transition: width 0.8s ease-in-out, height 0.8s ease-in-out;
		 -moz-transition: width 0.8s ease-in-out, height 0.8s ease-in-out;
			 -o-transition: width 0.8s ease-in-out, height 0.8s ease-in-out;
					transition: width 0.8s ease-in-out, height 0.8s ease-in-out;
  
  -webkit-transform: translate(-50%, -40%);
 		 -moz-transform: translate(-50%, -40%);
  		 -o-transform: translate(-50%, -40%);
          transform: translate(-50%, -40%);
}

body:not(.ie10) .qi_optionsHolder .qiOpt.flipPanel.selected .flipPanelFront:before{
  width: 300%;
  height: 400%;
}

body.ie10 .qi_optionsHolder .qiOpt.flipPanel.selected .flipPanelFront:before {
	content: "";
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
	z-index: -1;
}

.qi_optionsHolder .qiOpt.flipPanel .flipPanelFront{
	background-color: #585858;
	background-image: url(../framework_images/question_images/qq_opt_bg.png);
	background-position: center center;
	background-repeat: no-repeat;
	-webkit-transform: perspective(600px) rotateY(0deg);
		 -moz-transform: perspective(600px) rotateY(0deg);
			 -o-transform: perspective(600px) rotateY(0deg);
					transform: perspective(600px) rotateY(0deg);
}

.qi_optionsHolder .qiOpt.flipPanel .flipPanelBack{	
	background-position: center center;
	background-repeat: no-repeat;			
	-webkit-transform: perspective(600px) rotateY(-180deg);
		 -moz-transform: perspective(600px) rotateY(-180deg);
			 -o-transform: perspective(600px) rotateY(-180deg);
					transform: perspective(600px) rotateY(-180deg);
}

.qi_optionsHolder .qiOpt.flipPanel.selected.indicatorCorrect .flipPanelFront, .qi_optionsHolder .qiOpt.flipPanel.selected.indicatorIncorrect .flipPanelFront{	
	-webkit-transform: perspective(600px) rotateY(180deg);
		 -moz-transform: perspective(600px) rotateY(180deg);
			 -o-transform: perspective(600px) rotateY(180deg);
					transform: perspective(600px) rotateY(180deg);
}

.qi_optionsHolder .qiOpt.flipPanel.selected.indicatorCorrect .flipPanelBack, .qi_optionsHolder .qiOpt.flipPanel.selected.indicatorIncorrect .flipPanelBack{
	-webkit-transform: perspective(600px) rotateY(0deg);
		 -moz-transform: perspective(600px) rotateY(0deg);
			 -o-transform: perspective(600px) rotateY(0deg);
					transform: perspective(600px) rotateY(0deg);
}

.qi_optionsHolder .qiOpt.flipPanel.selected.indicatorCorrect .flipPanelBack{
	background-image: url(../framework_images/question_images/qq_opt_bg_correct.png);
}

.qi_optionsHolder .qiOpt.flipPanel.selected.indicatorIncorrect .flipPanelBack{
	background-image: url(../framework_images/question_images/qq_opt_bg_incorrect.png);
}

.qi_optionsHolder .qiOpt.flipPanel.disabled.selected {
	border: 0px;
	/* -webkit-transform: scale(1.1);
	 		-moz-transform: scale(1.1);
	 			-o-transform: scale(1.1);
	 				 transform: scale(1.1);*/
}

.qi_optionsHolder .qiOpt.flipPanel.disabled:not(.selected){
	 -webkit-transform: scale(0.8);
	 		-moz-transform: scale(0.8);
	 			-o-transform: scale(0.8);
	 				 transform: scale(0.8);
}

body:not(.xs) .qi_optionsHolder .qiOpt.flipPanel:not(.disabled) .flipPanelFront:after {
  content: '';
  display: block;
  position: absolute;
  top: 0px;
  left: 30px;
  width: 30px;
  height: 100%;
  background: rgba(255, 255, 255, 0.2);
  opacity: 0;
  
  -webkit-filter: blur(5px);
 	   -moz-filter: blur(5px);
  		 -o-filter: blur(5px);
          filter: blur(5px);
          
  -webkit-transform: translateX(-100px) skewX(-15deg);
  	 -moz-transform: translateX(-100px) skewX(-15deg);
  		 -o-transform: translateX(-100px) skewX(-15deg);
          transform: translateX(-100px) skewX(-15deg);
}

body:not(.touch_device):not(.ie10) .qi_optionsHolder .qiOpt.flipPanel:not(.disabled):hover .flipPanelFront:after {
  -webkit-transform: translateX(400px) skewX(-15deg);
  	 -moz-transform: translateX(400px) skewX(-15deg);
  		 -o-transform: translateX(400px) skewX(-15deg);
          transform: translateX(400px) skewX(-15deg);
  opacity: 1;
  
	-webkit-transition: all .7s;
		 -moz-transition: all .7s;
			 -o-transition: all .7s;
					transition: all .7s;
}


/*********************************************************************/
/**************************** SAMC ***********************************/
/*********************************************************************/
.qi_optionsHolder.samc .qiOptIndicator, .qi_optionsHolder.nasba .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_standard.png);
}

.qi_optionsHolder.samc .qiOpt.selected .qiOptIndicator, .qi_optionsHolder.nasba .qiOpt.selected .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_selected.png);
}

.qi_optionsHolder.samc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator, .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_incorrect.png);
}

.qi_optionsHolder.samc .qiOpt.selected.indicatorIncorrect .qiOptIndicator, .qi_optionsHolder.nasba .qiOpt.selected.indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_selected_incorrect.png);
}

.qi_optionsHolder.samc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator, .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_correct.png);
}

.qi_optionsHolder.samc .qiOpt.selected.indicatorCorrect .qiOptIndicator, .qi_optionsHolder.nasba .qiOpt.selected.indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_selected_correct.png);
}

/************ INVERSE VERSIONS ******************/
#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt .qiOptIndicator, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_standard_grey.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.selected .qiOptIndicator, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt.selected .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_selected_grey.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_incorrect_grey.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.selected.indicatorIncorrect .qiOptIndicator, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt.selected.indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_selected_incorrect.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_correct_grey.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.selected.indicatorCorrect .qiOptIndicator, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt.selected.indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_selected_correct.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.selected.indicatorIncorrect, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt.selected.indicatorIncorrect, #wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.flipPanel.selected.indicatorIncorrect .flipPanelBack{
	color: #fff !important;
	border-color: #fff !important;
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.selected.indicatorCorrect, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt.selected.indicatorCorrect, #wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.flipPanel.selected.indicatorCorrect .flipPanelBack{
	color: #fff !important;
	border-color: #fff !important;
}

/************ greyIcon VERSIONS ******************/
#wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt .qiOptIndicator.whiteIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_standard_grey.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt.selected .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt.selected .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt.selected .qiOptIndicator.whiteIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt.selected .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_selected_grey.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.whiteIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_incorrect_grey.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt.selected.indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt.selected.indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt.selected.indicatorIncorrect .qiOptIndicator.whiteIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt.selected.indicatorIncorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_selected_incorrect.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.whiteIcon,  #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_correct_grey.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt.selected.indicatorCorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt.selected.indicatorCorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt.selected.indicatorCorrect .qiOptIndicator.whiteIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt.selected.indicatorCorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_selected_correct.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt .qiOptIndicator.greyIcon, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt .qiOptIndicator.whiteIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_standard_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.selected .qiOptIndicator.greyIcon, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt.selected .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt.selected .qiOptIndicator.whiteIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt.selected .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_selected_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.whiteIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_incorrect_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.selected.indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt.selected.indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt.selected.indicatorIncorrect .qiOptIndicator.whiteIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt.selected.indicatorIncorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_selected_incorrect.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.greyIcon, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.whiteIcon,  #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_correct_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.selected.indicatorCorrect .qiOptIndicator.greyIcon, #wrapper.inverseColors .qi_optionsHolder.nasba .qiOpt.selected.indicatorCorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt.selected.indicatorCorrect .qiOptIndicator.whiteIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.nasba .qiOpt.selected.indicatorCorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/samc_selected_correct.png);
}



/*********************************************************************/
/**************************** SAMC (ictDark) *************************/
/*********************************************************************/
/*.qi_optionsHolder.samc .qiOpt.ictDark.selected.indicatorCorrect{
	border-color: #d0d451;
}

.qi_optionsHolder.samc .qiOpt.ictDark.selected.indicatorIncorrect{
	border-color: #fc0c0b;
}*/

/*********************************************************************/
/**************************** MAMC ***********************************/
/*********************************************************************/
.qi_optionsHolder.mamc .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_standard.png);
}

.qi_optionsHolder.mamc .qiOpt.selected .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_selected.png);
}

.qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_incorrect.png);
}

.qi_optionsHolder.mamc .qiOpt.selected.indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_selected_incorrect.png);
}

.qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_correct.png);
}

.qi_optionsHolder.mamc .qiOpt.selected.indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_selected_correct.png);
}

/************ INVERSE VERSIONS ******************/
#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_standard_grey.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt.selected .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_selected_grey.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_incorrect_grey.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt.selected.indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_selected_incorrect.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_correct_grey.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt.selected.indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_selected_correct.png);
}


/************ greyIcon VERSIONS ******************/
#wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_standard_grey.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt.selected .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt.selected .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_selected_grey.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_incorrect_grey.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt.selected.indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt.selected.indicatorIncorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_selected_incorrect.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_correct_grey.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt.selected.indicatorCorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt.selected.indicatorCorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_selected_correct.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_standard_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt.selected .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt.selected .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_selected_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorIncorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_incorrect_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt.selected.indicatorIncorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt.selected.indicatorIncorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_selected_incorrect.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt:not(.selected).indicatorCorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_correct_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt.selected.indicatorCorrect .qiOptIndicator.greyIcon, #wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt.selected.indicatorCorrect .qiOptIndicator.whiteIcon{
	background-image: url(../framework_images/question_images/mamc_selected_correct.png);
}

/*********************************************************************/
/**************************** MAMC (ictDark) *************************/
/*********************************************************************/
.qi_optionsHolder.mamc .qiOpt.ictDark.selected.indicatorCorrect{
	border-color: #06ff39;
}

.qi_optionsHolder.mamc .qiOpt.ictDark.selected.indicatorIncorrect{
	border-color: #fc0c0c;
}

/*********************************************************************/
/**************************** QUESTION GRAPHICAL *********************/
/*********************************************************************/
.qi_optionsHolder.samc .qiOpt.qiOptGraphical .qiOptIndicator{
	background-color: rgba(255, 255, 255, 0.8);
	border-radius: 100%;
}

#wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt.qiOptGraphical.selected.indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_incorrect_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.qiOptGraphical.selected.indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_incorrect_white.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.samc .qiOpt.qiOptGraphical.selected.indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_correct_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.samc .qiOpt.qiOptGraphical.selected.indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/samc_correct_white.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt.qiOptGraphical.selected.indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_incorrect_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt.qiOptGraphical.selected.indicatorIncorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_incorrect_white.png);
}

#wrapper:not(.inverseColors) .qi_optionsHolder.mamc .qiOpt.qiOptGraphical.selected.indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_correct_white.png);
}

#wrapper.inverseColors .qi_optionsHolder.mamc .qiOpt.qiOptGraphical.selected.indicatorCorrect .qiOptIndicator{
	background-image: url(../framework_images/question_images/mamc_correct_white.png);
}


/*********************************************************************/
/************************ MAMC HOTSPOT *******************************/
/*********************************************************************/
.qi_hotspotImg{
	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
	height: auto;
	max-height: 950px;
}

.qi_optionsHolder.mamc .qiOpt.qiHotspot{
	position: absolute;
	width: 96px;
	height: 93px;
	min-height: 93px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	border-radius: 0px;
	background-color: transparent;
	background-image: url(../framework_images/qi_mamc_hotspot_checkbox.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 100%;
	cursor: pointer;
	
	-webkit-transition: all .5s;
		 -moz-transition: all .5s;
			-ms-transition: all .5s;
			 -o-transition: all .5s;
					transition: all .5s;	
}

.qi_optionsHolder.mamc .qiOpt.qiHotspot.selected{
	background-image: url(../framework_images/qi_mamc_hotspot_selected.png);
}

.qi_optionsHolder.mamc .qiOpt.qiHotspot.limitedOptionsDisable{
	cursor: default;
}

.qi_optionsHolder.mamc .qiOpt.qiHotspot.selected.indicatorIncorrect{
	background-image: url(../framework_images/qi_mamc_hotspot_incorrect.png);
	border: 0px; 
}

.qi_optionsHolder.mamc .qiOpt.qiHotspot.selected.indicatorCorrect{
	background-image: url(../framework_images/qi_mamc_hotspot_correct.png); 
	border: 0px; 
}

.qi_optionsHolder.mamc .qiOpt.qiHotspot.indicatorIncorrect{
	background-image: url(../framework_images/qi_mamc_hotspot_incorrect_unselected.png);
	border: 0px; 
}

.qi_optionsHolder.mamc .qiOpt.qiHotspot.indicatorCorrect{
	background-image: url(../framework_images/qi_mamc_hotspot_correct_unselected.png); 
	border: 0px; 
}

/*********************************************************************/
/************************ SAMC HOTSPOT *******************************/
/*********************************************************************/
.qi_optionsHolder.samc .qiOpt.qiHotspot{
	position: absolute;
	width: 69px;
	height: 66px;
	min-height: 66px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	border-radius: 0px;
	background-color: transparent;
	background-image: url(../framework_images/qi_samc_hotspot_checkbox.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 100%;
	cursor: pointer;
	
	-webkit-transition: background-image .5s;
		 -moz-transition: background-image .5s;
			-ms-transition: background-image .5s;
			 -o-transition: background-image .5s;
					transition: background-image .5s;	
}

.qi_optionsHolder.samc .qiOpt.qiHotspot.selected{
	background-image: url(../framework_images/qi_samc_hotspot_selected.png);
}

.qi_optionsHolder.samc .qiOpt.qiHotspot.limitedOptionsDisable{
	cursor: default;
}

.qi_optionsHolder.samc .qiOpt.qiHotspot.selected.indicatorIncorrect{
	background-image: url(../framework_images/qi_samc_hotspot_incorrect.png);
	border: 0px; 
}

.qi_optionsHolder.samc .qiOpt.qiHotspot.selected.indicatorCorrect{
	background-image: url(../framework_images/qi_samc_hotspot_correct.png); 
	border: 0px; 
}

.qi_optionsHolder.samc .qiOpt.qiHotspot.indicatorIncorrect{
	background-image: url(../framework_images/qi_samc_hotspot_incorrect_unselected.png);
	border: 0px; 
}

.qi_optionsHolder.samc .qiOpt.qiHotspot.indicatorCorrect{
	background-image: url(../framework_images/qi_samc_hotspot_correct_unselected.png); 
	border: 0px; 
}

/*********************************************************************/
/***************** MULTI QUESTION STYLE ******************************/
/*********************************************************************/
.qi_optionsHolder.multiQuestion .qiOpt{
	padding: 10px 30px 10px 70px;
	border: 0px;
	border-radius: 0px;
	background-position: 10px 10px;
	background-repeat: no-repeat;
	background-color: transparent;
	background-size: auto;
	text-align: left;
	margin: 0px 0px 10px 0px;
}

body.rtl .qi_optionsHolder.multiQuestion .qiOpt{
	padding: 10px 70px 10px 30px;
	text-align: right;
}

.qi_optionsHolder.multiQuestion.samc .qiOpt{
	background-image: url(../framework_images/mq_samc_checkbox.png); 
}

.qi_optionsHolder.multiQuestion.mamc .qiOpt{
	background-image: url(../framework_images/mq_mamc_checkbox.png); 
}

.qi_optionsHolder.multiQuestion.samc .qiOpt.selected{
	background-color: #428ba7;
	background-image: url(../framework_images/mq_samc_selected.png); 
}

.qi_optionsHolder.multiQuestion.mamc .qiOpt.selected{
	background-color: #428ba7;
	background-image: url(../framework_images/mq_mamc_selected.png); 
}

.qi_optionsHolder.multiQuestion .qiOpt.selected.indicatorIncorrect {
	background-image: url(../framework_images/mq_mc_incorrect.png); 
	background-color: #f23;
	border: 0px;
}

.qi_optionsHolder.multiQuestion .qiOpt.selected.indicatorCorrect {
	background-image: url(../framework_images/mq_mc_correct.png); 
	background-color: #15b436;
	border: 0px;
}

.qi_optionsHolder.multiQuestion .qiOpt.indicatorCorrect {
	background-image: url(../framework_images/mq_mc_correct.png); 
	background-size: 35px 35px;
}

.qi_optionsHolder.multiQuestion .qiOpt.indicatorIncorrect {
	background-image: url(../framework_images/mq_mc_incorrect.png); 
	background-size: 35px 35px;
}

.qi_optionsHolder.multiQuestion.samc .qiOpt.selected.indicatorIncorrect {
	background-image: url(../framework_images/mq_samc_incorrect.png); 
	background-color: #f23;
	border: 0px;
}

.qi_optionsHolder.multiQuestion.samc .qiOpt.selected.indicatorCorrect {
	background-image: url(../framework_images/mq_samc_correct.png); 
	background-color: #15b436;
	border: 0px;
}

.qi_optionsHolder.multiQuestion.samc .qiOpt.indicatorCorrect {
	background-image: url(../framework_images/mq_samc_correct.png); 
	background-size: 35px 35px;
}

.qi_optionsHolder.multiQuestion.samc .qiOpt.indicatorIncorrect {
	background-image: url(../framework_images/mq_samc_incorrect.png); 
	background-size: 35px 35px;
}

.qi_optionsHolder .qiOpt.disabled{
	cursor: default;
}

.qi_optionsHolder .qiOpt.debugCorrect{
	border: 2px solid #3aaf26 !important;
}

.qi_optionsHolder .qiOpt.debugIncorrect{
	border: 2px dotted #c0362c !important;
}
/******************** GRID CSS ************************/
body.showScenarioGUI.gui_bottom #wrapper[data-template="tq_grid"] #questionPanel{
	padding-bottom: 70px;
}

.qiGridOpt{
	clear:both;
	/*width: 100%;*/
	min-height: 40px;
	padding: 10px 0px;
	margin-bottom: 0px;
}

.qiGridStag{
	position: relative;
	padding: 5px 0px 5px 0px;
	min-height: 55px;
}

.qiGridStag.notViewed{
	visibility: hidden;
	left: 30px;
}

.qiGridStag {
	border-width: 2px !important;
	padding: 20px;
	border-radius: 5px;
	margin-top:10px;
}

.qiGridStag.current{
	visibility: visible;
	padding: 30px;
	border-radius: 5px;
	margin-top:	20px;
	width: 100%;
	left: 0px;
	
	-webkit-transition: left 0.5s ease-in-out;
		 -moz-transition: left 0.5s ease-in-out;
			 -o-transition: left 0.5s ease-in-out;
			-ms-transition: left 0.5s ease-in-out;
					transition: left 0.5s ease-in-out;
}

.qiGridStag .qiGridStagTxt{
	float: left;
	width: calc(100% - 200px);
	padding-right: 20px;
	/*color:white !important;*/
}

.qiGridStag	.qiGridStagOpts{
	float: right;
	width: 200px;
	/*height: 30px;*/
	min-height: 30px;
	height: auto;
}

.qiGridStag.current .qiGridStagTxt{
	font-size: 1.4em;
	line-height: 1.1em;
}

.gridBtns{
	padding-top: 30px;
	padding-bottom: 30px;
	margin-left:0px;
}

body.rtl .gridBtns{
	float: right;
}

.gridBorderBottom{
	border-bottom: 2px solid #fff;
}

.qiGridHeading{
	clear:both;
	border-bottom: 2px solid #f39400;
	margin-top: 15px;
}

.qiGridHeading.multiQuestion{
	border-bottom: 0px;
}

.qiGridBox.normal{
	width: 63px;
	height: 63px;
	background-image: url(../framework_images/qi_grid_checkbox.png);
	background-position: top left;
	background-repeat: no-repeat;
	margin: 0px auto;
	margin-bottom: 10px;
	cursor: pointer;
	
	-webkit-transition: background-image 0.5s ease-in-out;
		 -moz-transition: background-image 0.5s ease-in-out;
			 -o-transition: background-image 0.5s ease-in-out;
			-ms-transition: background-image 0.5s ease-in-out;
					transition: background-image 0.5s ease-in-out;
}

.qiGridOpt:not(.qiGridStag) .qiGridBox.normal.selected{
	background-image: url(../framework_images/qi_grid_selected.png)
}

.qiGridOpt:not(.qiGridStag) .qiGridBox.normal.selected.indicatorIncorrect{
	background-image: url(../framework_images/qi_grid_incorrect.png)
}

.qiGridOpt:not(.qiGridStag) .qiGridBox.normal.selected.indicatorCorrect{
	background-image: url(../framework_images/qi_grid_correct.png)
}

.qiGridStag .qiGridBox.normal{
	position: relative;
	background-image: none;
	border-width: 1px !important;
	min-width: 80px;
	width: auto;
	padding: 0px 8px;
	height: 30px;
	line-height: 30px;
	border-radius: 5px;
	margin: 0px 10px 5px 10px;
	text-align: center;
	
	-webkit-transition: background-color 0.5s ease-in-out, border 0.5s ease-in-out, color 0.5s ease-in-out;
		 -moz-transition: background-color 0.5s ease-in-out, border 0.5s ease-in-out, color 0.5s ease-in-out;
			 -o-transition: background-color 0.5s ease-in-out, border 0.5s ease-in-out, color 0.5s ease-in-out;
			-ms-transition: background-color 0.5s ease-in-out, border 0.5s ease-in-out, color 0.5s ease-in-out;
					transition: background-color 0.5s ease-in-out, border 0.5s ease-in-out, color 0.5s ease-in-out;
}
/*
.qiGridStag .qiGridBox.normal.selected:not(.indicatorIncorrect):not(.indicatorCorrect){
	background-color: #fff;
	color: #2e3c54;
}*/


.qiGridOpt.qiGridStag .qiGridBox.normal.indicatorIncorrect::after {
  content: '';
  position: absolute;
	top: -15px;
	right: -25px;
  width: 39px;
  height: 36px;
	background-image: url(../framework_images/question_images/grid_incorrect.png);
	background-position: top left;
	background-repeat: no-repeat;
}


.qiGridOpt.qiGridStag .qiGridBox.normal.indicatorCorrect::after {
  content: '';
  position: absolute;
	top: -15px;
	right: -25px;
  width: 39px;
  height: 36px;
	background-image: url(../framework_images/question_images/grid_correct.png);
	background-position: top left;
	background-repeat: no-repeat;
}

.qiGridBox.animate{
	width: 40px;
	height: 40px;
	margin: 5px auto;
	border: 2px solid #fff;
	padding: 4px;
	cursor: pointer;
	overflow: hidden;
	position: relative;
}

.qiGridBox.disabled{
	cursor: default;
}

.qiGridBox.debugCorrect {
	border: 2px solid rgb(25, 179, 55) !important;
}

.qiGridBox.debugIncorrect {
	border: 2px solid rgb(251, 1, 2) !important;
}

.qiGridBox.animate.selected.indicatorCorrect > div.qiGridBox_front, .qiGridBox.animate.indicatorCorrect:not(.selected) > div.qiGridBox_back{
	opacity:0;
}

.qiGridBox.animate.selected.indicatorCorrect > div.qiGridBox_back, .qiGridBox.animate.indicatorCorrect:not(.selected) > div.qiGridBox_front{
	background-image: url(../framework_images/grid_correct.png);
	background-position:center center;
	background-repeat:no-repeat;
	background-size: 34px 34px;
	background-color: transparent;
}

.qiGridBox.animate.selected.indicatorIncorrect > div.qiGridBox_front, .qiGridBox.animate.indicatorIncorrect:not(.selected) > div.qiGridBox_back{
	opacity:0;
}

.qiGridBox.animate.selected.indicatorIncorrect > div.qiGridBox_back, .qiGridBox.animate.indicatorIncorrect:not(.selected) > div.qiGridBox_front{
	background-image: url(../framework_images/grid_incorrect.png);
	background-position:center center;
	background-repeat:no-repeat;
	background-size: 34px 34px;
	background-color: transparent;
}


.qiGridBox.animate .qiGridBox_front{
	width: 28px;
	height: 28px;
	background-color: #9b9fa7;
	
	/*display: block;*/
	transition: all 0.4s ;
	-moz-transform-origin: center bottom 0px;
	-moz-transition: transform  0.4s, background-color 0.4s ;
	-webkit-transform-origin: center bottom 0px;
	-webkit-transition: transform  0.4s, background-color 0.4s  ;
	-o-transform-origin: center bottom 0px;
	-o-transition: transform  0.4s, background-color 0.4s  ;
	-ms-transform-origin: center bottom 0px;
	-ms-transition: transform  0.4s, background-color 0.4s  ;
}

.qiGridBox.animate .qiGridBox_back{
	width: 28px;
	height: 28px;
	background-color: #58d9ff;
	
	/*display: block;*/
	transform-origin: center top 0px;
	transform: matrix3d(1, 0, 0, 0, 0, 0, -1, 0.166, 0, 1, 0, 0, 0, 0, 0, 1);
	-webkit-transform: matrix3d(1, 0, 0, 0, 0, 0, -1, 0.166, 0, 1, 0, 0, 0, 0, 0, 1);
	transition: all 0.4s ;
	-moz-transform-origin: center top 0px;
	-moz-transition: transform  0.4s, background-color 0.4s  ;
	-webkit-transform-origin: center top 0px;
	-webkit-transition: transform  0.4s, background-color 0.4s  ;
	-o-transform-origin: center top 0px;
	-o-transition: transform  0.4s, background-color 0.4s  ;
	-ms-transform-origin: center top 0px;
	-ms-transition: transform  0.4s, background-color 0.4s  ;
	opacity: 1; 
}

.qiGridBox.animate.selected > div.qiGridBox_front{
	transform-origin: center bottom 0px;
	transform: matrix3d(1, 0, 0, 0, 0, 0, 1, -0.00166, 0, -1, 0, 0, 0, -28, 0, 1);
	-moz-transform: matrix3d(1, 0, 0, 0, 0, 0, 1, -0.00166, 0, -1, 0, 0, 0, -28, 0, 1);
	-webkit-transform: matrix3d(1, 0, 0, 0, 0, 0, 1, -0.00166, 0, -1, 0, 0, 0, -28, 0, 1);
	-o-transform: matrix3d(1, 0, 0, 0, 0, 0, 1, -0.00166, 0, -1, 0, 0, 0, -28, 0, 1);
	-ms-transform: matrix3d(1, 0, 0, 0, 0, 0, 1, -0.00166, 0, -1, 0, 0, 0, -28, 0, 1);
}

.qiGridBox.animate.selected > div.qiGridBox_back{
	transform-origin: center top 0px;
	transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.00166, 0, -28, 0, 1);;
	-moz-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.00166, 0, -28, 0, 1);;
	-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.00166, 0, -28, 0, 1);;
	-o-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.00166, 0, -28, 0, 1);;
	-ms-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.00166, 0, -28, 0, 1);
}

.qiGridBox.explode{
	position: relative;
	width: 32px;
	margin: 0px auto;
	cursor: pointer;
}

.qiGridBox.explode.disabled{
	cursor: default;
}

.qiGridBox.explode.indicatorIncorrect{
	background-image: url(../framework_images/grid_incorrect.png);
	background-position:center center;
	background-repeat:no-repeat;
	background-size: 34px 34px;
	background-color: transparent;
	height: 34px;
	width: 34px;
}

.qiGridBox.explode.indicatorCorrect{
	background-image: url(../framework_images/grid_correct.png);
	background-position:center center;
	background-repeat:no-repeat;
	background-size: 34px 34px;
	background-color: transparent;
	height: 34px;
	width: 34px;
}

.qiGridBox.explode.indicatorCorrect .grid_dot, .qiGridBox.explode.indicatorIncorrect .grid_dot{
	display: none;
}

.qiGridBox.explode > .grid_dot{
	position: absolute;
	top: 8px;
	left: 8px;
	width: 16px;
	height: 16px;
	background-color: #fff;
	border-radius: 50%;
}

.qiGridBox.explode > .grid_circle{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	border: 5px solid #76d9ff;
	opacity:0;
}

.qiGridBox.explode > .line {
	position: absolute;
	width: 10px;
	height: 2px;
	background-color: #76d9ff;
	opacity:0;
}

.qiGridBox.explode > .line.zero {
	top: -5px;
	left: 15px;
	width: 2px;
	height: 10px;
}

.qiGridBox.explode > .line.one {
	top: 4px;
	left: 22px;
	transform: rotate(-45deg);
}

.qiGridBox.explode > .line.two {
	top: 15px;
	left: 26px;
}

.qiGridBox.explode > .line.three {
	left: 22px;
	top: 26px;
	transform: rotate(45deg);
}

.qiGridBox.explode > .line.four {
	top: 4px;
	left: 0px;
	transform: rotate(45deg);
}

.qiGridBox.explode > .line.five {
	top: 15px;
	left: -5px;
}

.qiGridBox.explode > .line.six {
	left: 0px;
	top: 26px;
	transform: rotate(-45deg);
}

.qiGridBox.explode > .line.seven {
	left: 15px;
	top: 26px;
	width: 2px;
	height: 10px;
}

.qiGridBox.explode.selected > .grid_dot{
	background-color: #76d9ff;
}

.qiGridBox.explode.selected:not(.indicatorCorrect):not(.indicatorIncorrect) > .grid_circle{
	opacity: 1;
	animation-name: explode;
	animation-duration: 0.350s;
}

.qiGridBox.explode.selected:not(.indicatorCorrect):not(.indicatorIncorrect) > .line.zero{
	animation-name:drop-zero;
	animation-delay: 0.100s;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
}

.qiGridBox.explode.selected:not(.indicatorCorrect):not(.indicatorIncorrect) > .line.one{
	animation-name:drop-one;
	animation-delay: 0.100s;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
}

.qiGridBox.explode.selected:not(.indicatorCorrect):not(.indicatorIncorrect) > .line.two{
	animation-name:drop-two;
	animation-delay: 0.100s;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
}

.qiGridBox.explode.selected:not(.indicatorCorrect):not(.indicatorIncorrect) > .line.three{
	animation-name:drop-three;
	animation-delay: 0.100s;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
}

.qiGridBox.explode.selected:not(.indicatorCorrect):not(.indicatorIncorrect) > .line.four{
	animation-name:drop-four;
	animation-delay: 0.100s;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
}

.qiGridBox.explode.selected:not(.indicatorCorrect):not(.indicatorIncorrect) > .line.five{
	animation-name:drop-five;
	animation-delay: 0.100s;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
}

.qiGridBox.explode.selected:not(.indicatorCorrect):not(.indicatorIncorrect) > .line.six{
	animation-name:drop-six;
	animation-delay: 0.100s;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
}

.qiGridBox.explode.selected:not(.indicatorCorrect):not(.indicatorIncorrect) > .line.seven{
	animation-name:drop-seven;
	animation-delay: 0.100s;
	animation-duration: 0.7s;
	animation-fill-mode: forwards;
}



@keyframes explode {
	0%{
		opacity: 0;
		transform: scale(3);
	}
	60%{
		opacity: 1;
		transform: scale(0.5);
	}
	100%{
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes drop-zero {
	0% {
		opacity: 0;
		height: 10px;
	}
	20% {
		opacity:1;
	}
	100% {
		transform: translateY(-8px);
		height: 0px;
		opacity:0;
	}
}

@keyframes drop-one {
	0% {
		opacity: 0;
		transform: rotate(-45deg);
		width: 10px;
	}
	20% {
		opacity:1;
	}
	100% {
		transform: rotate(-45deg) translate(15px);
		width: 0px;
		opacity:0;
	}
}

@keyframes drop-two {
	0% {
		opacity: 0;
		width: 10px;
	}
	20% {
		opacity:1;
	}
	100% {
		transform: translate(20px);
		width: 0px;
		opacity:0;
	}
}

@keyframes drop-three {
	0% {
		opacity: 0;
		transform: rotate(45deg);
		width: 10px;
	}
	20% {
		opacity:1;
	}
	100% {
		transform: rotate(45deg) translate(20px);
		width: 0px;
		opacity:0;
	}
}

@keyframes drop-four {
	0% {
		opacity: 0;
		transform: rotate(45deg);
		width: 10px;
	}
	20% {
		opacity:1;
	}
	100% {
		transform: rotate(45deg) translate(-9px);
		width: 0px;
		opacity:0;
	}
}

@keyframes drop-five {
	0% {
		opacity: 0;
		width: 10px;
	}
	20% {
		opacity:1;
	}
	100% {
		transform: translate(-10px);
		width: 0px;
		opacity:0;
	}
}

@keyframes drop-six {
	0% {
		opacity: 0;
		transform: rotate(-45deg);
		width: 10px;
	}
	20% {
		opacity:1;
	}
	100% {
		transform: rotate(-45deg) translate(-14px);
		width: 0px;
		opacity:0;
	}
}

@keyframes drop-seven {
	0% {
		opacity: 0;
		height: 10px;
	}
	20% {
		opacity:1;
	}
	100% {
		transform: translateY(20px);
		height: 0px;
		opacity:0;
	}
}



.ie9 .qiGridBox_back{
	display: none;
}

.ie9 .questionStemPanelBack, .ie9 .rateQuestionStemPanelBack{
	display: none;
}

.ie9 .flipQuestionPanel.flipped .questionStemPanelBack, .ie9 .flipQuestionPanel.flipped .rateQuestionStemPanelBack{
	display: block;
}

.ie9 .flipQuestionPanel.flipped .questionStemPanelFront, .ie9 .flipQuestionPanel.flipped .rateQuestionStemPanelFront{
	display: none;
}

.ie9 .qiGridBox.animate.selected > div.qiGridBox_front{
	background-color: #58d9ff;
}

.ie9 .qiGridBox.animate.selected.indicatorIncorrect > div.qiGridBox_front, .qiGridBox.animate.indicatorIncorrect:not(.selected) > div.qiGridBox_front{
	opacity: 1;
	background-image: url(../framework_images/grid_incorrect.png);
	background-position:center center;
	background-repeat:no-repeat;
	background-size: 34px 34px;
	background-color: transparent;
}

.ie9 .qiGridBox.animate.selected.indicatorCorrect > div.qiGridBox_front, .qiGridBox.animate.indicatorCorrect:not(.selected) > div.qiGridBox_front{
	opacity: 1;
	background-image: url(../framework_images/grid_correct.png);
	background-position:center center;
	background-repeat:no-repeat;
	background-size: 34px 34px;
	background-color: transparent;
}

.qibtn_common{
	width: 200px;
	height: 35px;
	background-color: #f39400;
	border-radius: 5px;
	cursor: pointer;
	
	-webkit-transition: background-color 0.5s ease-in-out;
		 -moz-transition: background-color 0.5s ease-in-out;
			 -o-transition: background-color 0.5s ease-in-out;
			-ms-transition: background-color 0.5s ease-in-out;
					transition: background-color 0.5s ease-in-out;
}

.qibtn_common.vi_fullWidth{
	width: 100%;
}

.qibtn_common.mqbtnStyle{
	width: 230px;
	background-color: #76d9ff;
}

.qibtn_common.disabled{
	background-color: #555555;
	cursor: default;
}

.qibtn_blue{
	background-color: rgba(118, 218, 255, 1);
	width: 100%;
	cursor: pointer;
	
	-webkit-transition: background-color 0.5s ease-in-out;
		 -moz-transition: background-color 0.5s ease-in-out;
			 -o-transition: background-color 0.5s ease-in-out;
			-ms-transition: background-color 0.5s ease-in-out;
					transition: background-color 0.5s ease-in-out;
}

.qibtn_blue.disabled{
	background-color: rgba(118, 218, 255, 0.36);
	cursor: default;
}

.qiFeedback{
	/*padding: 10px 10px 10px 70px;*/
	background-position: 10px 10px;
	background-repeat: no-repeat;
	
	/*-webkit-transition: background-image 0.5s ease-in-out;
		 -moz-transition: background-image 0.5s ease-in-out;
			 -o-transition: background-image 0.5s ease-in-out;
			-ms-transition: background-image 0.5s ease-in-out;
					transition: background-image 0.5s ease-in-out;*/
}

.gridFeedback.qiFeedback{
	background-position: 30px 30px;
	padding: 220px 30px 0px 30px;
	height: 100%;
	background-color: rgba(256, 256, 256, 0.95);
	position:absolute;
	right:0px;
	top:0px;
}

body.rtl .gridFeedback.qiFeedback{
	right: initial;
	right: auto;
	left: 0px;
	background-position-x: calc(100% - 30px);
}

body.rtl.sm .gridFeedback.qiFeedback{
	padding: 20px 150px 20px 20px;
}

.qiFeedback.incorrect, .qiFeedback.partically, .qiFeedback.partically_retry, .qiFeedback.retry{
	background-image: url(../framework_images/question_images/icon_incorrect.png);
}

.qiFeedback.correct{
	background-image: url(../framework_images/question_images/icon_correct.png);
}

.questionStemPanelBack.qiFeedback.greyRoundedPanel.qiFeedback.correct, .questionStemPanelBack.qiFeedback.greyRoundedPanel.qiFeedback.incorrect, .questionStemPanelBack.qiFeedback.greyRoundedPanel.qiFeedback.partically, .questionStemPanelBack.qiFeedback.greyRoundedPanel.qiFeedback.partically_retry, .questionStemPanelBack.qiFeedback.greyRoundedPanel.qiFeedback.retry{
	padding-top: 210px;
}

.questionStemPanelBack.qiFeedback.fullScreenWhitePanel.qiFeedback.correct, .questionStemPanelBack.qiFeedback.fullScreenWhitePanel.qiFeedback.incorrect, .questionStemPanelBack.qiFeedback.fullScreenWhitePanel.qiFeedback.partically, .questionStemPanelBack.qiFeedback.fullScreenWhitePanel.qiFeedback.partically_retry, .questionStemPanelBack.qiFeedback.fullScreenWhitePanel.qiFeedback.retry{
	padding-top: 210px;
}

body.showScenarioGUI.gui_top.xl .flipCard.qiFeedback.incorrect, body.showScenarioGUI.gui_top.lg .flipCard.qiFeedback.incorrect, body.showScenarioGUI.gui_top.md .flipCard.qiFeedback.incorrect,
body.showScenarioGUI.gui_top.xl .flipCard.qiFeedback.partically, body.showScenarioGUI.gui_top.lg .flipCard.qiFeedback.partically, body.showScenarioGUI.gui_top.md .flipCard.qiFeedback.partically,
body.showScenarioGUI.gui_top.xl .flipCard.qiFeedback.partically_retry, body.showScenarioGUI.gui_top.lg .flipCard.qiFeedback.partically_retry, body.showScenarioGUI.gui_top.md .flipCard.qiFeedback.partically_retry,
body.showScenarioGUI.gui_top.xl .flipCard.qiFeedback.retry, body.showScenarioGUI.gui_top.lg .flipCard.qiFeedback.retry, body.showScenarioGUI.gui_top.md .flipCard.qiFeedback.retry
{
	background-position-y: 40px !important;
}

.qiFeedback.ictPanel{
	background-image: none;
}

.qiFeedback.multiQuestion{
	background-position: 10% center;
	min-height: 100px;
	padding: 20px 0px 0px 0px;
	margin-bottom: 80px;
}

.qiFeedback.multiQuestion.incorrect, .qiFeedback.multiQuestion.partically, .qiFeedback.multiQuestion.partically_retry, .qiFeedback.multiQuestion.retry{
	background-image: url(../framework_images/mq_feedbackIncorrect.png);
	background-color: #f23;
}

.qiFeedback.multiQuestion.correct{
	background-image: url(../framework_images/mq_feedbackCorrect.png);
	background-color: #15b436;
}

.questionStemPanelBack.qiFeedback.fullScreenWhitePanel{
	background-position: 30px 30px;
	padding: 70px 30px 0px 30px;
}

.questionStemPanelBack.qiFeedback.greyRoundedPanel{
	background-position: 30px 30px;
	padding: 70px 30px 30px 30px;
}

.questionStemPanelBack.qiFeedback.fullScreenClearPanel{
	background-position: center 30px;
	padding: 120px 15px 0px 15px;
}

body.rtl .questionStemPanelBack.qiFeedback.fullScreenWhitePanel{
	background-position-x: calc(100% - 30px);
}

body.rtl .questionStemPanelBack.qiFeedback.greyRoundedPanel{
	background-position-x: calc(100% - 30px);
}

body.rtl .questionStemPanelBack.qiFeedback.fullScreenClearPanel{
	background-position-x: calc(100% - 30px);
}

body.showScenarioGUI.gui_top.xl .questionStemPanelBack.qiFeedback.fullScreenWhitePanel, body.showScenarioGUI.gui_top.lg .questionStemPanelBack.qiFeedback.fullScreenWhitePanel, body.showScenarioGUI.gui_top.md .questionStemPanelBack.qiFeedback.fullScreenWhitePanel{
	padding-top: 230px;
}

.qiFeedback.feedbackPanel{
	width: 100%;
	min-height: 70px;
	padding: 20px 20px 20px 20px;
	/*background-color: rgba(255,0,255,0.7);*/
	border-radius: 10px;
	opacity: 0;
	background-position: 10px 10px;
	background-repeat: no-repeat;
}

.qiFeedback.feedbackPanel.incorrect, .qiFeedback.feedbackPanel.partically, .qiFeedback.feedbackPanel.partically_retry, .qiFeedback.feedbackPanel.retry{
	background-image: url(../framework_images/question_images/feedback_panel_incorrect.png);
}

.qiFeedback.feedbackPanel.correct{
	background-image: url(../framework_images/question_images/feedback_panel_correct.png);
}

#wrapper.inverseColors .qiFeedback.feedbackPanel.incorrect, #wrapper.inverseColors .qiFeedback.feedbackPanel.partically, #wrapper.inverseColors .qiFeedback.feedbackPanel.partically_retry, #wrapper.inverseColors .qiFeedback.feedbackPanel.retry{
	background-image: url(../framework_images/question_images/feedback_panel_incorrect_grey.png);
}

#wrapper.inverseColors .qiFeedback.feedbackPanel.correct{
	background-image: url(../framework_images/question_images/feedback_panel_correct_grey.png);
}

body:not(.rtl) #wrapper.inverseColors .qiFeedback.feedbackPanel.correct, body:not(.rtl) #wrapper.inverseColors .qiFeedback.feedbackPanel.incorrect, body:not(.rtl) #wrapper.inverseColors .qiFeedback.feedbackPanel.partically, body:not(.rtl) #wrapper.inverseColors .qiFeedback.feedbackPanel.partically_retry, body:not(.rtl) #wrapper.inverseColors .qiFeedback.feedbackPanel.retry, body:not(.rtl) .qiFeedback.feedbackPanel.correct, body:not(.rtl) .qiFeedback.feedbackPanel.incorrect, body:not(.rtl) .qiFeedback.feedbackPanel.partically, body:not(.rtl) .qiFeedback.feedbackPanel.partically_retry, body:not(.rtl) .qiFeedback.feedbackPanel.retry{
	padding-left: 80px;
}

body.rtl .qiFeedback.feedbackPanel{
	padding: 20px 20px 20px 20px;
	background-position: calc(100% - 10px) 10px;
}

body.rtl #wrapper.inverseColors .qiFeedback.feedbackPanel.correct, body.rtl #wrapper.inverseColors .qiFeedback.feedbackPanel.incorrect, body.rtl #wrapper.inverseColors .qiFeedback.feedbackPanel.partically, body.rtl #wrapper.inverseColors .qiFeedback.feedbackPanel.partically_retry, body.rtl #wrapper.inverseColors .qiFeedback.feedbackPanel.retry, body.rtl .qiFeedback.feedbackPanel.correct, body.rtl .qiFeedback.feedbackPanel.incorrect, body.rtl .qiFeedback.feedbackPanel.partically, body.rtl .qiFeedback.feedbackPanel.partically_retry, body.rtl .qiFeedback.feedbackPanel.retry{
	padding-right: 80px;
}


/*************** MULTI QUESTION *********************/
.mqModule{
	display: none;
	position:absolute;
	top: 0px;
	left: -9000px;
	height: 100%;
	width: 100%;
}

.mqModule.currentmqModule{
	display: block;
	left: 0px;
}

.mqModule.currentmqModule.hiddenMqModule{
	display: none;
}

.mqModule.indicators{
	padding-top: 200px;
}

.mqQuestionWrapper{
	padding: 0px 10%;
}

.mqQuestionWrapper .qi_optionsHolder{
	margin-bottom: 30px;
}

#qiReturn{
	position: absolute;
	top: 0px;
	left: -70px;
	background-image: url(../framework_images/mq_return.png);
	background-position:center center;
	background-repeat:no-repeat;
	width: 144px;
	height: 97px;
	padding: 30px 0px 0px 0px;
	cursor: pointer;
}

#qiNext.mqBtn{
	position: absolute;
	top: 0px;
	right: -70px;
	background-image: url(../framework_images/mq_next.png);
	background-position:center center;
	background-repeat:no-repeat;
	width: 144px;
	height: 97px;
	padding: 30px 40px 0px 0px;
	cursor: pointer;
}

.mq_basicPanel{
	position: relative;
	top: 0px;
	height: auto;
	width: 100%;
	/*margin-bottom: 80px;*/
	z-index: 15;
}

.mqbtn_common{
	width: 200px;
	bottom: 15px;
	
	background-color: #76d9ff;
	cursor: pointer;
}

.mqbtn_common.mqbtnStyle{
	width: 230px;
	background-color: #76d9ff;
	border-radius: 0px;
}


.mqbtn_common.disabled{
	
	-webkit-transition: background-color 0.5s ease-in-out;
		 -moz-transition: background-color 0.5s ease-in-out;
			 -o-transition: background-color 0.5s ease-in-out;
			-ms-transition: background-color 0.5s ease-in-out;
					transition: background-color 0.5s ease-in-out;
	background-color: #ccc;
	cursor: default;
}


.createQuestionButtonsHere{
	height: auto;
	z-index: 22;
	max-width: 660px;
	margin: 0px auto;
}

.mq_bg{
	background-color: rgba(0,0,0,0.5);
	padding-bottom: 80px;
}

.mqbtn_select{
	position: relative;
	height: 40px;
	width: 340px;
	margin: 10px 10px 10px auto;
	background-color: #6056b7;
	border-radius: 18px;
	cursor: pointer;
}

.mqbtn_select:nth-child(odd) {
	margin: 10px auto 10px 10px;
}

.mqbtn_select_text{
	padding: 8px 8px 8px 45px;
}

.mqbtn_select:nth-child(odd) .mqbtn_select_text{
	padding: 8px 45px 8px 8px;
}

.mqbtn_select .numIndicator {
	position: absolute;
	top: 3px;
	left: 3px;
	border-radius: 30px;
	height: 34px;
	width: 34px;
	padding: 5px 0px;
	text-align: center;
	color: #dedede;
	background-color: rgba(0, 0, 0, 0);
	border: 2px solid #dedede;
	
	background-position: center center;
	background-repeat: no-repeat;
	
	-webkit-transition: background-image .5s;
		 -moz-transition: background-image .5s;
			-ms-transition: background-image .5s;
			 -o-transition: background-image .5s;
					transition: background-image .5s;	
}

.mqbtn_select:nth-child(odd) .numIndicator {
	left: auto;
	right: 5px
}

.mqbtn_select.correct .numIndicator{
	background-color: #15b436;
	background-image: url(../framework_images/mq_qComplete.png);
	font-size: 0px;
}

.mqbtn_select.incorrect .numIndicator{
	background-color: #c0362c;
	background-image: url(../framework_images/mq_qIncomplete.png);
	font-size: 0px;
}



/*************************************************/
/****************** SUNRAY EFFECT ****************/
/*************************************************/
#wrapper:not(.xs) #rayEffect{
  position:fixed;
  margin:auto;
  top:0;
  bottom:0;
  left:0;
  right:0;
  height:100%;
  width:100%;
}

#wrapper.xs #rayEffect{
	display: none;
}

.ray {
  position:absolute;
  width:100%;
  height:10px;
  background: -moz-linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(255, 255, 255,0.1) 50%,rgba(0, 0, 0,0) 100%);
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(255, 255, 255,0.1) 50%,rgba(0, 0, 0,0) 100%);
  transform-origin:100% 50%;
}

.ray1 {
  transform: perspective(50px) rotateY(30deg);
}
.ray2 {
  transform: rotate(-10deg) perspective(50px) rotateY(30deg);  
}
.ray3 {
  transform: rotate(-20deg) perspective(50px) rotateY(30deg);
}
.ray4 {
  transform: rotate(-30deg) perspective(50px) rotateY(30deg);
}
.ray5 {
  transform: rotate(-40deg) perspective(50px) rotateY(30deg);  
}
.ray6 {
  transform: rotate(-50deg) perspective(50px) rotateY(30deg);
}
.ray7 {
  transform: rotate(-60deg) perspective(50px) rotateY(30deg);
}
.ray8 {
  transform: rotate(-70deg) perspective(50px) rotateY(30deg);  
}
.ray9 {
  transform: rotate(-80deg) perspective(50px) rotateY(30deg);
}
.ray10 {
  transform: rotate(10deg) perspective(50px) rotateY(30deg);  
}
.ray11 {
  transform: rotate(20deg) perspective(50px) rotateY(30deg);
}
.ray12 {
  transform: rotate(30deg) perspective(50px) rotateY(30deg);
}
.ray13 {
  transform: rotate(-90deg) perspective(50px) rotateY(30deg);  
}
.ray14 {
  transform: rotate(-100deg) perspective(50px) rotateY(30deg);
}
.ray15 {
  transform: rotate(-110deg) perspective(50px) rotateY(30deg);
}

/*************************************************/
/**************** FULLSCREEN FEEDBACK ************/
/*************************************************/
#questionPanel.fullscreenFeedback{
	z-index: 40;
}

#questionPanel.fullscreenFeedback .optHolder.qiOpt:not(.selected):not(.indicatorCorrect):not(.indicatorIncorrect){
	opacity: 0.5;
}

#questionPanel.fullscreenFeedback #qiSubmit{
	display: none;
}

#feedbackOverlay .fullScreenFeedbackIcon, #feedbackICTOverlay .fullScreenFeedbackIcon{
	height: 183px;
	width: 171px;
	background-image: url(../framework_images/question_images/icon_incorrect.png);
	background-position: center center;
	background-repeat: no-repeat;
}

#feedbackOverlay.correct .fullScreenFeedbackIcon, #feedbackICTOverlay.correct .fullScreenFeedbackIcon{
	background-image: url(../framework_images/question_images/icon_correct.png);
}


#feedbackOverlay.correct .question_correct_label, #feedbackICTOverlay.correct .question_correct_label{
	display: block;
	border-bottom: 2px solid;
}

#feedbackOverlay:not(.correct) .question_incorrect_label, #feedbackICTOverlay:not(.correct) .question_incorrect_label{
	display: block;
	border-bottom: 2px solid;
}

#feedbackICTOverlay{
	position: absolute;
	top: 0px;
	left: -2000px;
	width: 100%;
	padding: 0px 60px;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	opacity: 0;
	
	-webkit-transition: opacity 1.5s ease-out, left 0.4s ease-in;
  	 -moz-transition: opacity 1.5s ease-out, left 0.4s ease-in;
  		 -o-transition: opacity 1.5s ease-out, left 0.4s ease-in;
  				transition: opacity 1.5s ease-out, left 0.4s ease-in;
}

#feedbackICTOverlay.show{
	left: 0px;
	opacity: 1;
}


.quizcomplete{
	margin-top: 20px;
}

.largeIndicator{
	position: absolute;
	bottom: 20px;
	left: 50%;
	opacity: 0;
	
	-webkit-transition: opacity 1.5s ease-out;
  	 -moz-transition: opacity 1.5s ease-out;
 		  -ms-transition: opacity 1.5s ease-out;
  		 -o-transition: opacity 1.5s ease-out;
  				transition: opacity 1.5s ease-out;
	
	
	 -webkit-transform: perspective(1px) translateX(-50%);
  	  -moz-transform: perspective(1px) translateX(-50%);
  		  -o-transform: perspective(1px) translateX(-50%);
 				   transform: perspective(1px) translateX(-50%);
}

.largeIndicator.current{
	opacity: 1;
}



#inlineIndicator{
	display: block;
  margin: 20px auto 0px auto;
  height: 200px;
  width: 200px;
	opacity: 0;
  
	background-image: none;
	background-position: center center;
	background-repeat: no-repeat;
	
	-webkit-transition: opacity 0.5s ease, background-image 1s ease;
  	 -moz-transition: opacity 0.5s ease, background-image 1s ease;
  		 -o-transition: opacity 0.5s ease, background-image 1s ease;
  				transition: opacity 0.5s ease, background-image 1s ease;
}

body:not(.heIL).rtl #inlineIndicator:not(.correct):not(.incorrect):not(.retry):not(.partically_retry):not(.partically){
	-webkit-transform: scaleX(-1);
		 -moz-transform: scaleX(-1);
		   -o-transform: scaleX(-1);
					transform: scaleX(-1);
}

body:not(.heIL).rtl #inlineIndicator{
	-webkit-transition: none !important;
  	 -moz-transition: none !important;
  		 -o-transition: none !important;
  				transition: none !important;
}

#inlineIndicator.indicatorBottom{
	position: absolute;
	bottom: 20px;
	left: 50%;
	margin-left: -92px;
	opacity: 1;
}

body.showScenarioGUI.gui_bottom #inlineIndicator.indicatorBottom{
	bottom: 70px;
}

#inlineIndicator.indicatorCenter{
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -100px 0px 0px -100px;
	background-size: 0%;
	border-radius: 100%;
	opacity: 1;
	overflow: hidden;
	z-index: 40;
}

#inlineIndicator.indicatorCenter:before{
	content: "";
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 50%;
	background-color: inherit;
}

body.rtl #inlineIndicator.correct.indicatorCenter:before, body.rtl #inlineIndicator.incorrect.indicatorCenter:before, body.rtl #inlineIndicator.retry.indicatorCenter:before, body.rtl #inlineIndicator.partically_retry.indicatorCenter:before, body.rtl #inlineIndicator.partically.indicatorCenter:before{
	left: 100px;
}

#inlineIndicator.indicatorCenter:after{
	content: "";
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
	background-image: inherit;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 90%;
}

#wrapper:not(.inverseColors) #inlineIndicator.indicatorBottom, #wrapper:not(.inverseColors) #inlineIndicator.indicatorCenter{
	background-image: url(../framework_images/question_images/question_feedback_mark.png);
}

#wrapper.inverseColors #inlineIndicator.indicatorBottom, #wrapper.inverseColors #inlineIndicator.indicatorCenter{
	background-image: url(../framework_images/question_images/question_feedback_mark_grey.png);
}

#wrapper.inverseColors #inlineIndicator.correct, #wrapper:not(.inverseColors) #inlineIndicator.correct{
	opacity: 1;
	background-image: url(../framework_images/question_images/question_feedback_correct.png);
}

#wrapper.inverseColors #inlineIndicator.incorrect, #wrapper.inverseColors #inlineIndicator.partically_retry, #wrapper.inverseColors #inlineIndicator.retry, #wrapper.inverseColors #inlineIndicator.partically, #wrapper:not(.inverseColors) #inlineIndicator.incorrect, #wrapper:not(.inverseColors) #inlineIndicator.partically_retry, #wrapper:not(.inverseColors) #inlineIndicator.retry, #wrapper:not(.inverseColors) #inlineIndicator.partically{
	opacity: 1;
	background-image: url(../framework_images/question_images/question_feedback_incorrect.png);
}

/**************************************************************************************/
/**************************** MATCHING TEMPLATE ***************************************/
/**************************************************************************************/

body.ios.sm #wrapper.tq_matching_graphical #questionPanel, body.mac.os.x.sm #wrapper.tq_matching_graphical #questionPanel{
	margin-bottom: 100px;
}

.qiMatchBox{
	position: relative;
	height: auto;
	border-radius: 5px;
	margin-bottom: 20px;
	background-color: #fff;
	border: 2px solid #ccc;
}

.matchOptionHolder{
	padding: 10px;
	width: 100%;
	min-height: 130px;
	height: auto;
}

.dropdown.matchSelector{
	position: relative;
	min-height: 40px;
	width: 100%;
}

.dropdown.disabled .selLabel{
	cursor: default;
}

.dropdown.matchSelector.active{
	z-index:10;
}

#matchingGraphicalItems .dropdown.matchSelector .dropdown-list li.selected{
	background-color: #f23;
}

#matchingGraphicalItems .dropdown.matchSelector .dropdown-list li.debug_correct{
	border: 2px solid #00ff1c;
}

div[id^="match_"]:not(.active) .dropdown-list li{
	box-shadow: none;
}

div[id^="match_"].active .dropdown-list li:last-child{
  margin-bottom: 100px;
}

.qiMatchBox.disabled .matchSelector{
	cursor: default;
}

.qiMatchBox.indicatorCorrect .selLabel{
	background-image: url(../framework_images/question_images/samc_correct_white.png); 
	background-position: 98% center;
	background-repeat: no-repeat;
}

.qiMatchBox.indicatorIncorrect .selLabel{
	background-image: url(../framework_images/question_images/samc_incorrect_white.png); 
	background-position: 98% center;
	background-repeat: no-repeat;
}

body.rtl .qiMatchBox.indicatorCorrect .selLabel{
	background-position: 2% center;
}

body.rtl .qiMatchBox.indicatorIncorrect .selLabel{ 
	background-position: 2% center;
}

.dropdown.disabled .dropdown-list, .qiMatchBox.indicatorCorrect .dropdown-list, .qiMatchBox.indicatorIncorrect .dropdown-list{
	display: none;
}

body.sm #questionPanel .row.margin_top_10{
	margin-bottom: 60px;
}

/**************************************************************************************/
/************************* GRAPHICAL QUIZ TEMPLATE ************************************/
/**************************************************************************************/

/* ************** CLIENT LOGO **************/
.graphicalLogo{
	margin-bottom: 40px;
}

body.xs .graphicalLogo{
	margin-top: 40px;
	width: 70%;
}

.graphicalQuestionLogo{
	position: absolute;
	bottom: 100px;
	left: 60px;
}

body.md .graphicalQuestionLogo, body.lg .graphicalQuestionLogo{
	max-width: 200px;
}

body.xs .graphicalQuestionLogo, body.sm .graphicalQuestionLogo{
	display: none;
}

#gameInformationLayer{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
}

/* ************** START BUTTON **************/
.graphicalBtnHolder{
	display: inline-block;
	margin: 0px auto;
}

.graphicalBtnHolder_start{
	position: relative;
	top: -30px;
	width: 250px;
	margin: 0px auto;
}

body.xs .graphicalBtnHolder_start{
	top: 0px;
}

.graphicalBtnHolder_reStart, .graphicalBtnHolder_print{
	position: relative;
	top: -50px;
	width: 250px;
	margin: 0px auto;
	float: left;
}

.graphicalJSON_Btn{
	position: relative;
	margin-top: 20px;
	top: -30px;
	cursor: pointer;
}

.graphicalJSON_Btn .graphicalJSON_Btn_Animation{
	height: 250px;
	width: 250px;
}

.graphicalJSON_Btn_Txt{
	position: absolute;
	top: 140px;
	left: 51%;
	background-image: url(../framework_images/graphicalQuiz_images/go_arrow.png);
	background-repeat: no-repeat;
	background-position: 15px 5px;
	background-size: 18px;
	padding-top: 45px;
	width: 250px;
	text-align: left;
}

#mcGraphicalSummary .gqMultiplierFeedbackTxt{
	font-size: 22px;
}

.graphicalBtnHolder_reStart .graphicalJSON_Btn_Txt, .graphicalBtnHolder_print .graphicalJSON_Btn_Txt{
	position: absolute;
	top: 150px;
	left: 150px;
	background-position: 5px 5px;
	width: 250px;
	text-align: left;
	line-height: 30px;
}

body.xs .graphicalBtnHolder_reStart .graphicalJSON_Btn_Txt, body.xs .graphicalBtnHolder_print .graphicalJSON_Btn_Txt{
	width: 180px;
	left: 120px;
	background-position: 45px 5px;
}

.gameInfoBtn{
	float: left;
	display: inline-block;
	min-width: 200px;
	max-width: 100%;
	text-align: left;
	width: auto;
	padding-left: 50px;
	margin-bottom: 35px;
	height: 40px;
	line-height: 40px !important;
	border-radius: 6px;
	cursor: pointer;
	
	background-image: url(../framework_images/graphicalQuiz_images/game_information.svg);
	background-position: left center;
	background-repeat: no-repeat;
	background-size: 39px 39px;
}

body.xs .gameInfoBtn{
	position: absolute;
	top: -35px;
	left: -35px;
}

.gameInfoCloseBtn{
	display: inline-block;
	min-width: 200px;
	max-width: 100%;
	width: auto;
	height: 44px;
	line-height: 34px !important;
	cursor: pointer;
	border-radius: 6px;
}

/* ************** QUESTION SLIDES **************/
#multiQuestionGraphical #mcGraphicalQuestion div#questionPanel {
	position:absolute;
	top:25px;
	left: 50%;
	width: 85vh;
	padding:0px;
	height: 85vh;
	
	-webkit-transform: translateX(-50%);
		 -moz-transform: translateX(-50%);
		   -o-transform: translateX(-50%);
					transform: translateX(-50%);
}

/* ************** QUESTION OPTIONS **************/
#multiQuestionGraphical #mcGraphicalQuestion .optBox{
	width:100%;
	height:100%;
	border-radius:50%;
	overflow:hidden;
}

body.xs #multiQuestionGraphical #mcGraphicalQuestion .optBox{
	height:auto;
}

body:not(.xs):not(.sm) #multiQuestionGraphical #mcGraphicalQuestion .qi_optionsHolder{
	height: 100%;
}

#multiQuestionGraphical #mcGraphicalQuestion .qi_optionsHolder .graphicalOpt{
	position: relative;
	text-align: center;
	min-height: 70px;
	height: 50%;
	border-radius: 0px;
	border-width: 0px;
	margin: 0px;
	padding: 0px;
	box-shadow: none;
	overflow: hidden;
	
	-webkit-transition: none;
		 -moz-transition: none;
		   -o-transition: none;
					transition: none;
					
	-webkit-transform: none;
		 -moz-transform: none;
			 -o-transform: none;
					transform: none;
}

#multiQuestionGraphical #mcGraphicalQuestion .qi_optionsHolder .graphicalOpt.selected.indicatorCorrect{
	background-color: #7ac340;
	color: #ffffff;
	border: none;
}

#multiQuestionGraphical #mcGraphicalQuestion .qi_optionsHolder .graphicalOpt.selected.indicatorIncorrect{
	background-color: #cc3434;
	color: #ffffff;
	border: none;
}

body.accessiblefocus #multiQuestionGraphical #mcGraphicalQuestion .qi_optionsHolder .graphicalOpt:not(.indicatorCorrect):not(.indicatorIncorrect):focus{
	background-color: #fda8a8;
}

.qi_optionsHolder .graphicalOpt.selected {
	background-color: #333;
}

.graphicalOpt .graphicalOptTxt{
	position: absolute;
	top: 35%;
	width: 63%;
	left: 50%;
	
	-webkit-transform: translateX(-50%);
		 -moz-transform: translateX(-50%);
		   -o-transform: translateX(-50%);
					transform: translateX(-50%);
}

body.sm .graphicalOpt .graphicalOptTxt{
	top: 40%;
}

body.xs .graphicalOpt .graphicalOptTxt{
	top: auto;
	top: initial;
	bottom: 100px;
}

.graphicalOpt:last-child  .graphicalOptTxt{
	top: auto;
	top: initial;
	bottom: 35%;
}

body.sm .graphicalOpt:last-child  .graphicalOptTxt{
	top: auto;
	top: initial;
	bottom: 40%;
}

body.xs .graphicalOpt:last-child  .graphicalOptTxt{
	bottom: auto;
	bottom: initial;
	top: 100px;
}

.qi_optionsHolder .graphicalOpt.selected .graphicalOptTxt{
	color: #fff;
}

.graphicalOpt .graphicalOptIndicator{
	position: absolute;
	top: 15%;
	left: 50%;
	height: 60px;
	width: 60px;
	
	-webkit-transform: translateX(-50%);
		 -moz-transform: translateX(-50%);
		   -o-transform: translateX(-50%);
					transform: translateX(-50%);
}

.graphicalOpt:last-child  .graphicalOptIndicator{
	top: auto;
	top: initial;
	bottom: 15%;
}

.graphicalOpt #feedbackSprite{
	display: none;
	position: absolute;
	top: 60px;
	left: 50%;
	margin-left: -111px;
	height: 221px !important;
	width: 222px !important;
	overflow: hidden;
	z-index: 30;
}

.graphicalOpt:last-child  #feedbackSprite{
	top: auto;
	top: initial;
	bottom: 60px;
}

.graphicalOpt.selected.indicatorCorrect #feedbackSprite, .graphicalOpt.selected.indicatorIncorrect #feedbackSprite{
	display: block;
}

.graphicalOpt.selected.indicatorCorrect .graphicalOptIndicator, .graphicalOpt.selected.indicatorIncorrect .graphicalOptIndicator{
	display: none;
}

/* ************** QUESTION PANEL **************/
.mcGraphicalQuestionPanel{
	position:absolute;
	top:50%;
	left:50%;
	width:120%;
	box-shadow:4px 4px 5px 5px rgba(0,0,0,0.1);
	border-radius:10px;
	padding: 40px;
	z-index:20;
	
  -webkit-transform: translateY(-50%) translateX(-50%);
  	 -moz-transform: translateY(-50%) translateX(-50%);
  		 -o-transform: translateY(-50%) translateX(-50%);
 				  transform: translateY(-50%) translateX(-50%);
}

body.md .mcGraphicalQuestionPanel{
	padding: 15px;
}

.mcGraphicalQuestionPanel .questionIndicator{
	width: 100%;
}

body.md #multiQuestionGraphical .graphicalCountdown, body.md #multiQuestionGraphical .graphicalCountdown > div, body.md #multiQuestionGraphical .graphicalCountdown canvas, body.md #multiQuestionGraphical #mcGraphicalQuestion div#questionPanel{
	width: 550px !important;
	height: 550px !important;
	min-width: 0px !important;
	min-height: 0px !important;
}

body:not(.xs):not(.sm) .mcGraphicalQuestionPanel.mobileView{
	display: none;
}
	
.mcGQPanel_label{
	display: inline-block;
	position: absolute;
	left: 50%;
	top: 0px;
	padding: 10px;
	width: auto;
	border-radius: 8px;
	line-height: 0.8 !important;
	z-index: 5;
	
	
	-webkit-transform: translateX(-50%) translateY(-50%);
		 -moz-transform: translateX(-50%) translateY(-50%);
		   -o-transform: translateX(-50%) translateY(-50%);
					transform: translateX(-50%) translateY(-50%);
}

/* ************** FEEDBACK IMAGE **************/

#wrapper #mqgImageFeedback {
	position:absolute;
	top:15px;
	left:20px;
	opacity:0;
	width:230px;
	height:auto;
	background-repeat:no-repeat;
	background-size:contain;
	z-index:41;
	
	-webkit-transform: scale(0.2);
		 -moz-transform: scale(0.2);
		   -o-transform: scale(0.2);
					transform: scale(0.2);
	
	-webkit-transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
		 -moz-transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
		   -o-transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
					transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
}

#wrapper #mqgImageFeedback.showImage{
	-webkit-transform: scale(1);
		 -moz-transform: scale(1);
		   -o-transform: scale(1);
					transform: scale(1);
					
	opacity:1;
}

#wrapper #mqgImageFeedback .mqgImageFeedbackTxt{
	display:block;
	position:absolute;
	top: 170px;
	left: 0px;
	height: auto;
	width: 120%;
	margin-left: -10%;
	font-size: 25px;
	text-align: center;
	color: #cc3434;
	z-index:10;
}

body.md #wrapper #mqgImageFeedback .mqgImageFeedbackTxt{
	font-size: 16px;
}

#wrapper #mqgImageFeedback.correct .mqgImageFeedbackTxt{
	color: #7ac340;
}

.angleText{
	-webkit-transform: rotate(-5deg);
		 -moz-transform: rotate(-5deg);
		   -o-transform: rotate(-5deg);
					transform: rotate(-5deg);
}

/* ************** SCOREBAR HOLDER **************/
#multiplerScoreBarHolder{
  position: absolute;
  top: 100px;
  right: 20px;
  height: auto;
  width: 140px;
  background-color: rgba(255, 255, 255, 0.5);
  box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.1);
	border-radius: 15px;
	padding: 15px 15px 0px 15px;
  z-index: 5;
}

#wrapper.inverseColors #multiplerScoreBarHolder{
  background-color: rgba(0, 0, 0, 0.5);
  box-shadow: 2px 2px 20px rgba(255, 255, 255, 0.1);
}

body.md #multiplerScoreBarHolder{
  top: 15px;
}

body.xl #multiplerScoreBarHolder{
  right: 8%;
}

#multiplerScoreBarHolder .mcb_scorebar_label, #multiplerScoreBarHolder .mcb_numberOfQuestions_txt{
	margin-bottom: 10px;
	text-align: center;
	font-weight: 900;
}
/*
body.md #multiplerScoreBarHolder .mcb_scorebar_label{
	text-align: right;
	padding-right: 10px;
}
*/
/* ************** MULTIPLIER GRAPHIC **************/
.largeMultiplierGraphicHolder{
	position: fixed;
	top:0%;
	left:0%;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: 120;
}

.largeMultiplierGraphic{
	position: absolute;
	top:50%;
	left:50%;
	width: auto;
	height: 100px;
	font-size: 35em;
	font-weight: 900;
	line-height: 100px;
	text-align: center;
	color: #dedede;
}

body.xs .largeMultiplierGraphic{
	font-size: 15em;
}

.largeMultiplierGraphic.animate{
  -webkit-animation: multiplier_scale 1.5s ease-out 1 normal forwards;
          animation: multiplier_scale 1.5s ease-out 1 normal forwards;
}

@-webkit-keyframes multiplier_scale{
  0% {
    -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
            transform: translateY(-50%) translateX(-50%) scale(1);
		opacity: 0.4;
  }
  100% {
    -webkit-transform: translateY(-50%) translateX(-50%) scale(3);
            transform: translateY(-50%) translateX(-50%) scale(3);
		opacity: 0;
  }
}

@keyframes multiplier_scale{
  0% {
    -webkit-transform: translateY(-50%) translateX(-50%) scale(1);
            -ms-transform: translateY(-50%) translateX(-50%) scale(1);
        transform: translateY(-50%) translateX(-50%) scale(1);
		opacity: 0.4;
  }
  100% {
    -webkit-transform: translateY(-50%) translateX(-50%) scale(3);
            -ms-transform: translateY(-50%) translateX(-50%) scale(3);
        transform: translateY(-50%) translateX(-50%) scale(3);
		opacity: 0;
  }
}

.mcb_multiplier{
	position: relative;
	margin-left: -50px;
	width: 210px;
	height: 160px;
}

body.md .mcb_multiplier{
	top: 10px;
	margin-left: -18px;
	width: 145px;
	height: auto;
}

body.rtl.md .mcb_multiplier{
	left: 18px;
}

body.rtl.lg .mcb_multiplier, body.rtl.xl .mcb_multiplier{
	left: 50px;
}

.mcb_multiplier .mcb_multiplier_txt{
	position: absolute;
	top: 45px;
	left: 40px;
	font-size: 21px;
	line-height: 19px;
	z-index: 10;
}

body.lg .mcb_multiplier .mcb_multiplier_txt{
	word-break: break-word;
	width: 70%;
}

body.lg.ie .mcb_multiplier .mcb_multiplier_txt{
	word-break: break-all;
	width: 70%;
}

body.md .mcb_multiplier .mcb_multiplier_txt{
	display: none;
}

.mcb_multiplier .mcb_multiplier_num{
	position: absolute;
	top: 85px;
	left: 100px;
	font-size: 60px;
	line-height: 34px;
	font-weight: 900;
	
	z-index: 10;
	opacity: 0;
	
	-webkit-transform: scale(0.2);
		 -moz-transform: scale(0.2);
		   -o-transform: scale(0.2);
					transform: scale(0.2);
	
	-webkit-transition: transform 0.2s ease-in-out;
		 -moz-transition: transform 0.2s ease-in-out;
		   -o-transition: transform 0.2s ease-in-out;
					transition: transform 0.2s ease-in-out;
}

body.md .mcb_multiplier .mcb_multiplier_num{
	top: 30px;
	left: 50px;
	font-size: 40px;
}

body.md.ie11 .mcb_multiplier .mcb_multiplier_num{
	top: 50px;
}

.mcb_multiplier .mcb_multiplier_num.show{
	-webkit-transform: scale(1);
		 -moz-transform: scale(1);
		   -o-transform: scale(1);
					transform: scale(1);
					
	opacity:1;
}

/* ************** SCOREBAR HOLDER **************/
.mcb_scorebarHolder{
	position: relative;
	height: calc(100vh - 600px);
	min-height: 300px;
	width: 20px;
	border: 3px solid rgba(88,88,88,0.4);
	border-radius: 10px;
	box-shadow: 0px 0px 4px 4px #ffffff;
	margin: 0px auto;
}

.mcb_scorebar_bar{
	position: absolute;
	right: 2px;
	bottom: 2px;
	/*width: calc(100% - 4px);*/
	max-width: calc(100% - 4px);
	min-width: calc(100% - 4px);
	max-height: calc(100% - 4px);
	height: 100px;
	border-radius: 5px;
	
	-webkit-transition: height 0.3s ease-in-out, width 0.3s ease-in-out;
		 -moz-transition: height 0.3s ease-in-out, width 0.3s ease-in-out;
		   -o-transition: height 0.3s ease-in-out, width 0.3s ease-in-out;
					transition: height 0.3s ease-in-out, width 0.3s ease-in-out;
}

.mcb_scorebar_num{
	position: absolute;
	left: -75px;
	bottom: 0px;
	height: 80px;
	width: 65px;
	
	text-align: center;
	font-size: 30px;
	font-weight: 900;
	
	background-image: url(../framework_images/graphicalQuiz_images/curscore_arrow.png);
	background-position: bottom right;
	background-repeat: no-repeat;
	
	-webkit-transition: bottom 0.3s ease-in-out;
		 -moz-transition: bottom 0.3s ease-in-out;
		   -o-transition: bottom 0.3s ease-in-out;
					transition: bottom 0.3s ease-in-out;
}

body.md .mcb_scorebar_num, body.md .mcb_scorebar_multi{
	height: 65px;
	font-size: 20px;
}

.mcb_scorebarHolder .mcb_scorebar_multi{
	position: absolute;
	left: 23px;
	bottom: 0px;
	height: 80px;
	width: 65px;
	color: #8a8a8a;
	text-align: center;
	font-size: 30px;
	font-weight: 900;
	
	-webkit-transition: bottom 0.3s ease-in-out;
		 -moz-transition: bottom 0.3s ease-in-out;
		   -o-transition: bottom 0.3s ease-in-out;
					transition: bottom 0.3s ease-in-out;
}

body.xs .mcb_scorebarHolder .mcb_scorebar_multi, body.sm .mcb_scorebarHolder .mcb_scorebar_multi, body.xs .mcb_scorebarHolder #feedbackSprite, body.sm .mcb_scorebarHolder #feedbackSprite{
	display: none;
}

.mcb_scorebarHolder #feedbackSprite{
	position: absolute;
	top: 60px;
	left: 50%;
	margin-left: -111px;
	height: 221px !important;
	width: 222px !important;
	overflow: hidden;
	z-index: 30;
}

.mcb_scorebarHolder .mcb_scorebar_passmark{
	position: absolute;
	height: 8px;
	width: 100%;
	border: 1px solid #fff;
	border-width: 1px 0px;
}

.mcb_scorebarHolder svg{
	position: absolute;
	height: 30px;
	width: 30px;
}

.mcb_numberOfQuestions_txt{
	padding: 15px 0px 5px 0px;
}

/* ************** SUMMARY PAGE **************/
.mcgraphicalFinalScore{
	position: relative;
	width: 282px;
	height: 165px;
	margin: 0px auto;
}

body.xs .mcgraphicalFinalScore{
	width: 80%;
}

.mcgraphicalFinalScore_txt{
	position: absolute;
	top: 10px;
	left: 0px;
	color: #e9c23a;
	line-height: 130px;
	font-size: 50px;
	font-weight: 900;
	width: 100%;
}

/*************** Large Countdown **************/
#multiQuestionGraphical	.graphicalCountdownHolder{
	position: relative;
}

#multiQuestionGraphical	.graphicalCountdownHolder.hideCountdown{
	opacity: 0;
}

.graphicalCountdown{
	position:absolute;
	top:25px;
	left: 50%;
	height: 85vh;
	width: 85vh;
	padding:0px;
	
	-webkit-transform: translateX(-50%);
		 -moz-transform: translateX(-50%);
		   -o-transform: translateX(-50%);
					transform: translateX(-50%);
}

.graphicalCountdown canvas{
	width: 100%;
}

#multiQuestionGraphical .graphicalCountdown, #multiQuestionGraphical .graphicalCountdown > div, #multiQuestionGraphical .graphicalCountdown canvas, #multiQuestionGraphical #mcGraphicalQuestion div#questionPanel{
	min-width: 650px !important;
	min-height: 650px !important;
}

.graphicalCountdown input{
	position:absolute;
	top:0px;
	left: 0px;
	height: 1px;
	width: 1px;
	opacity: 0;
}

.graphicalCountdown_time{
	position: absolute;
	left: 50%;
	font-size: 35px;
	z-index: 40;
	
	-webkit-transform: translateX(-50%);
		 -moz-transform: translateX(-50%);
		   -o-transform: translateX(-50%);
					transform: translateX(-50%);
}

body:not(.xs) .graphicalCountdown_time{
	top: 20px !important;
}

body.md .graphicalCountdown_time{
	font-size: 30px;
}

/*************** SMALL Countdown **************/
.miniGraphicalCountdown{
	display: none;
	position:absolute;
	top:15px;
	height: 40px;
	width: 40px;
	left: 90px;
	padding:0px;
}

body.sm .miniGraphicalCountdown{
	display: block;
}


body.xs .miniGraphicalCountdown{
	display: block;
	top: 55px;
	left: 15px;
	height: 70px;
	width: 70px;
	background-color: #fff;
	border-radius: 50%;
	padding: 5px;
}

body.sm #multiQuestionGraphical .miniGraphicalCountdown, body.sm #multiQuestionGraphical .miniGraphicalCountdown > div, body.sm #multiQuestionGraphical .miniGraphicalCountdown canvas{
	min-width: 35px !important;
	min-height: 35px !important;
}

body.xs #multiQuestionGraphical .miniGraphicalCountdown, body.xs #multiQuestionGraphical .miniGraphicalCountdown > div, body.xs #multiQuestionGraphical .miniGraphicalCountdown canvas{
	min-width: 60px !important;
	min-height: 60px !important;
}

.miniGraphicalCountdown input{
	position:absolute;
	top:0px;
	left: 0px;
	height: 1px;
	width: 1px;
	opacity: 0;
}

/*********************** RETRY BUTTON **************************/
.quizBtn{
	display: inline-block;
	min-width: 200px;
	max-width: 100%;
	width: auto;
	height: 40px;
	line-height: 34px !important;
	padding: 0px 10px;
	border-radius: 6px;
	cursor: pointer;
}

.quizBtn.disabled{
	background-color: rgb(202, 202, 202);
	background-color: rgba(202, 202, 202, 0.36);
	opacity: 0.5;
	cursor: default;
}

.quizBtn.centerBtn{
	margin-right: auto;
	margin-left: auto;
}

/*********************** BACKGROUND ANIMATIONS **************************/
ul.iconsHolder {
	display: none;
  position: fixed;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

body:not(.xs) .interfaceSlide.curPageSlide #multiQuestionGraphical ul.iconsHolder {
	display: block;
}

ul.iconsHolder li.bgIcon{
	background-image: url(../framework_images/graphicalQuiz_images/questionmark.svg);
	background-position: center center;
	background-repeat: no-repeat;
	min-height: 150px;
	min-width: 150px;
}

ul.iconsHolder li.bgIcon{
  position: absolute;
  top: 110%;
  list-style: none;
  -webkit-animation: icon_animation linear 5s infinite;
     -moz-animation: icon_animation linear 5s infinite;
       -o-animation: icon_animation linear 5s infinite;
          animation: icon_animation linear 5s infinite;
}

ul.iconsHolder li.bgIcon:nth-child(1) {
  left: 8.333333333333334%;
  opacity: 0.02;
  -webkit-animation-delay: 0s;
     -moz-animation-delay: 0s;
       -o-animation-delay: 0s;
          animation-delay: 0s;
}

ul.iconsHolder li.bgIcon:nth-child(5) {
  left: 41.66666666666667%;
  opacity: 0.02;
  -webkit-animation-delay: 0s;
     -moz-animation-delay: 0s;
       -o-animation-delay: 0s;
          animation-delay: 0s;
}

body.xs ul.iconsHolder li.bgIcon:nth-child(5), body.sm ul.iconsHolder li.bgIcon:nth-child(5), body.md ul.iconsHolder li.bgIcon:nth-child(5){
  opacity: 0;
}

ul.iconsHolder li.bgIcon:nth-child(9) {
  left: 75%;
  opacity: 0.02;
  -webkit-animation-delay: 0s;
     -moz-animation-delay: 0s;
       -o-animation-delay: 0s;
          animation-delay: 0s;
}

ul.iconsHolder li.bgIcon:nth-child(2) {
  left: 16.666666666666668%;
  opacity: 0.01;
  -webkit-animation-delay: 2s;
     -moz-animation-delay: 2s;
       -o-animation-delay: 2s;
          animation-delay: 2s;
}

ul.iconsHolder li.bgIcon:nth-child(6) {
  left: 50%;
  opacity: 0.01;
  -webkit-animation-delay: 2s;
     -moz-animation-delay: 2s;
       -o-animation-delay: 2s;
          animation-delay: 2s;
}

body.xs ul.iconsHolder li.bgIcon:nth-child(6), body.sm ul.iconsHolder li.bgIcon:nth-child(6), body.md ul.iconsHolder li.bgIcon:nth-child(6){
  opacity: 0;
}

ul.iconsHolder li.bgIcon:nth-child(10) {
  left: 83.33333333333334%;
  opacity: 0.01;
  -webkit-animation-delay: 2s;
     -moz-animation-delay: 2s;
       -o-animation-delay: 2s;
          animation-delay: 2s;
}

ul.iconsHolder li.bgIcon:nth-child(3) {
  left: 25%;
  opacity: 0.02;
  -webkit-animation-delay: 1s;
     -moz-animation-delay: 1s;
       -o-animation-delay: 1s;
          animation-delay: 1s;
}

ul.iconsHolder li.bgIcon:nth-child(7) {
  left: 58.33333333333334%;
  opacity: 0.02;
  -webkit-animation-delay: 1s;
     -moz-animation-delay: 1s;
       -o-animation-delay: 1s;
          animation-delay: 1s;
}

body.xs ul.iconsHolder li.bgIcon:nth-child(7), body.sm ul.iconsHolder li.bgIcon:nth-child(7), body.md ul.iconsHolder li.bgIcon:nth-child(7){
  opacity: 0;
}

ul.iconsHolder li.bgIcon:nth-child(11) {
  left: 91.66666666666669%;
  opacity: 0.02;
  -webkit-animation-delay: 1s;
     -moz-animation-delay: 1s;
       -o-animation-delay: 1s;
          animation-delay: 1s;
}

ul.iconsHolder li.bgIcon:nth-child(4) {
  left: 33.333333333333336%;
  opacity: 0.01;
  -webkit-animation-delay: 3s;
     -moz-animation-delay: 3s;
       -o-animation-delay: 3s;
          animation-delay: 3s;
}

ul.iconsHolder li.bgIcon:nth-child(8) {
  left: 66.66666666666667%;
  opacity: 0.01;
  -webkit-animation-delay: 3s;
     -moz-animation-delay: 3s;
       -o-animation-delay: 3s;
          animation-delay: 3s;
}

body.xs ul.iconsHolder li.bgIcon:nth-child(8), body.sm ul.iconsHolder li.bgIcon:nth-child(8), body.md ul.iconsHolder li.bgIcon:nth-child(8){
  opacity: 0;
}

ul.iconsHolder li.bgIcon:nth-child(12) {
  left: 100%;
  opacity: 0.01;
  -webkit-animation-delay: 3s;
     -moz-animation-delay: 3s;
       -o-animation-delay: 3s;
          animation-delay: 3s;
}

@-webkit-keyframes icon_animation {
  0% {
    -webkit-transform: rotate(0deg) scale(1);
       -moz-transform: rotate(0deg) scale(1);
         -o-transform: rotate(0deg) scale(1);
            transform: rotate(0deg) scale(1);
    top: 100%;
  }
  50% {
    -webkit-transform: rotate(180deg) scale(3);
       -moz-transform: rotate(180deg) scale(3);
         -o-transform: rotate(180deg) scale(3);
            transform: rotate(180deg) scale(3);
  }
  100% {
    -webkit-transform: rotate(360deg) scale(0.5);
       -moz-transform: rotate(360deg) scale(0.5);
         -o-transform: rotate(360deg) scale(0.5);
            transform: rotate(360deg) scale(0.5);
    top: -20%;
  }
}

@-moz-keyframes icon_animation {
  0% {
    -webkit-transform: rotate(0deg) scale(1);
       -moz-transform: rotate(0deg) scale(1);
         -o-transform: rotate(0deg) scale(1);
            transform: rotate(0deg) scale(1);
    top: 100%;
  }
  50% {
    -webkit-transform: rotate(180deg) scale(3);
       -moz-transform: rotate(180deg) scale(3);
         -o-transform: rotate(180deg) scale(3);
            transform: rotate(180deg) scale(3);
  }
  100% {
    -webkit-transform: rotate(360deg) scale(0.5);
       -moz-transform: rotate(360deg) scale(0.5);
         -o-transform: rotate(360deg) scale(0.5);
            transform: rotate(360deg) scale(0.5);
    top: -20%;
  }
}

@-o-keyframes icon_animation {
  0% {
    -webkit-transform: rotate(0deg) scale(1);
       -moz-transform: rotate(0deg) scale(1);
         -o-transform: rotate(0deg) scale(1);
            transform: rotate(0deg) scale(1);
    top: 100%;
  }
  50% {
    -webkit-transform: rotate(180deg) scale(3);
       -moz-transform: rotate(180deg) scale(3);
         -o-transform: rotate(180deg) scale(3);
            transform: rotate(180deg) scale(3);
  }
  100% {
    -webkit-transform: rotate(360deg) scale(0.5);
       -moz-transform: rotate(360deg) scale(0.5);
         -o-transform: rotate(360deg) scale(0.5);
            transform: rotate(360deg) scale(0.5);
    top: -20%;
  }
}

@keyframes icon_animation {
  0% {
    -webkit-transform: rotate(0deg) scale(0.5);
       -moz-transform: rotate(0deg) scale(0.5);
         -o-transform: rotate(0deg) scale(0.5);
            transform: rotate(0deg) scale(0.5);
    top: 95%;
  }
  50% {
    -webkit-transform: rotate(180deg) scale(3);
       -moz-transform: rotate(180deg) scale(3);
         -o-transform: rotate(180deg) scale(3);
            transform: rotate(180deg) scale(3);
  }
  100% {
    -webkit-transform: rotate(360deg) scale(0.5);
       -moz-transform: rotate(360deg) scale(0.5);
         -o-transform: rotate(360deg) scale(0.5);
            transform: rotate(360deg) scale(0.5);
    top: -10%;
  }
}

/*********************** STANDALONE UPDATES **************************/
body.standAlone.md #multiQuestionGraphical, body.standAlone.lg #multiQuestionGraphical, body.standAlone.xl #multiQuestionGraphical{
	padding-top: 80px;
}

body.standAlone.md .mqModule[data-module_type="mcGraphicalQuestion"], body.standAlone.lg .mqModule[data-module_type="mcGraphicalQuestion"], body.standAlone.xl .mqModule[data-module_type="mcGraphicalQuestion"]{
	top: 80px;
	height: calc(100% - 80px);
}

body.standAlone.md #multiplerScoreBarHolder, body.standAlone.lg #multiplerScoreBarHolder, body.standAlone.xl #multiplerScoreBarHolder{
	top: 180px;
}

body.standAlone #interfacePhone{
	display: none;
}

body.standAlone.xs .interfaceSlide{
	height: 100%;
}

body.standAlone.patternCover_1, body.standAlone #language_Panel{
	background-image: url(../course/assets/gq_01_01/gq_01_01_bg.jpg);
}

body.standAlone .knob_preloader input{
	color: #525252 !important;
}

body.standAlone #audio.interfaceBtn, body.standAlone #language.interfaceBtn{
	float: right;
	margin-right: 15px;
}

body.standAlone.sm .mcb_multiplier{
	right: 80px;
}

body.standAlone.sm .mcb_scorebarHolder{
	width: calc(100% - 400px);
}

body.standAlone #glossary_Panel, body.standAlone #resources_Panel, body.standAlone #help_Panel, body.standAlone #contacts_Panel, body.standAlone #complaints_Panel{
	background-image: none;
}

body.standAlone .slide_up, body.standAlone .slide_down, body.standAlone .slide_left, body.standAlone .slide_right, body.standAlone .slide_up.topBottom, body.standAlone .slide_up.topBottom.disabled, body.standAlone:not(.touch_device) .slide_up.topBottom:not(.disabled):hover{
	background-image: none;
}

body.standAlone #language_Panel .closeComponentBtn{
	background-image: url(../tools/interface_1/images/closeBtn_dark.png);
}

body.standAlone .pillNav{
	display: none;
}

body.xs.standAlone #interfaceRegular{
	display: block !important;
	top: -70px;
}

body.xs.standAlone #interfaceRegular #audio{
	display: none;
}

body.xs.standAlone:not(.standAloneQuestion) #interfaceRegular #language{
	position: absolute;
	top: 60px;
	right: 0px;
	margin-right: 0px;
}

body.standAlone.standAloneQuestion #interfaceRegular #language{
	display: none;
}

body.standAlone .iconBtn .iconBtnTxt{
  max-width: 70px;
}

#questions_dot_css{
	display: none;
}