.overlay {
    background-color:#EFEFEF;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 1000;
    top: 0px;
    left: 0px;
    opacity: .5; /* in FireFox */ 
    filter: alpha(opacity=50); /* in IE */
}

.qtitlecontainer{
  overflow:hidden;
  width: 100%;
  }
  
  
.qtitlecellleft{width: calc(100% - 130px); float:left; text-align: left;}
.qtitlecellright{width: 130px; float:right; text-align: right; color: #FFFFA7; font-weight: bold;}
.reviewtitlecell{width: 100%; float:left; text-align: left;}
.userguidetimertext{color: #FFFFA7; font-weight: bold;}


.questioncontainer{
    padding-left: 20px;
    padding-right: 20px;
    text-align: left;
    
  	/* CORNER ROUNDING ........ 3 by default*/
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		border-radius: 5px;
}

.questioncontainer img {
  margin: auto;
  display: block;
  padding-top: 5px;
  max-width: 100%;
  max-height: auto;
}

.questiontablecontainer {
    padding-top: 5px;
    padding-bottom: 5px;
    width: auto;
    border: hidden;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
}
.questiontableblock {
  width: auto;
  border: 1px solid #FFFFFF;
  margin-top: 0px;
  margin-bottom: 10px;
  margin-left: 0px;
  margin-right: 0px;
  padding: 5px;
  display: inline-block;
  text-align: center;
}

.questionid {
  font-size: x-small;
  font-style: italic;
  float: right;
}

.answercontainer {
    padding-top: 40px;
    padding-right: 40px;
    padding-bottom: 40px;
    padding-left: 40px;
    text-align: left;
    /* CORNER ROUNDING ........ 3 by default*/
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		border-radius: 5px;
}

.answercontainer ul{
  list-style: none;
  margin: 0;
  padding: 0;
  overflow: auto;
}

.answercontainer ul li{
  color: #FFFFFF;
  display: block;
  position: relative;
  float: left;
  width: 100%;
  height: auto;
	border-bottom: 1px solid #333;
}

.answercontainer ul li input[type=radio]{
  position: absolute;
  visibility: hidden;
}

.answercontainer ul li label{
  display: block;
  position: relative;
  font-weight: 100;
  font-size: 1.00em;
  padding: 20px 15px 15px 30px;
  margin: 8px auto;
  height: auto;
  z-index: 9;
  cursor: pointer;
  -webkit-transition: all 0.25s linear;
}

.answercontainer ul li:hover label{
	color: #7DF4FF;
}

.answercontainer ul li .check{
  display: block;
  position: absolute;
  border: 2px solid #AAAAAA;
  border-radius: 100%;
  height: 15px;
  width: 15px;
  top: 30px;
  left: 0px;
	z-index: 5;
	transition: border .25s linear;
	-webkit-transition: border .25s linear;
}

.answercontainer ul li:hover .check {
  border: 2px solid #FFFFFF;
}

.answercontainer ul li .check::before {
  display: block;
  position: absolute;
	content: '';
  border-radius: 100%;
  height: 7px;
  width: 7px;
  top: 4px;
	left: 4px;
  margin: auto;
	transition: background 0.25s linear;
	-webkit-transition: background 0.25s linear;
}

.explanationcontainer{
    padding-left: 20px;
    padding-right: 20px;
    text-align: left;
        /* CORNER ROUNDING ........ 3 by default*/
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		border-radius: 5px;
}

.explanationcontainer img {
  margin: auto;
  display: block;
  padding-top: 5px;
  max-width: 100%;
  max-height: auto;
}

.explanationtablecontainer {
    padding-top: 5px;
    padding-bottom: 5px;
    width: auto;
    border: hidden;
    text-align: left;
    margin-left: auto;
    margin-right: auto;
}
.explanationtableblock {
  width: auto;
  border: 1px solid #FFFFFF;
  margin-top: 0px;
  margin-bottom: 10px;
  margin-left: 0px;
  margin-right: 0px;
  padding: 5px;
  display: inline-block;
  text-align: center;
}

input[type=radio]:checked ~ .check {
  border: 2px solid #FFFF00; /* Was #0DFF92 */
}

input[type=radio]:checked ~ .check::before{
  background: #FFFF00;
}

input[type=radio]:checked ~ label{
  color: #FFFF00;
}

.qnumbercontainer{
    padding-top: 7px;
    padding-bottom: 7px;
    width: auto;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid #ffffff;
    /* CORNER ROUNDING ........ 3 by default*/
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		border-radius: 5px;
}

.qnumberblock {
  width: 30px;
  border: 1px solid #D25400;
  margin: 3px;
  display: inline-block;
  background: #FF6600;
        /* CORNER ROUNDING ........ 3 by default*/
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		border-radius: 5px;
}

.qnumberblock p {
  padding: 6px;
  margin: 0;
  text-align: center;
}

.qnumberanswered {
  background: #4444FA; /* was #006400 */
  border: 1px solid #0505A9; /* was 1px solid #004800*/
}

.qnumbercorrect {
  background: #006400;
  border: 1px solid #004800;
}

.qnumberwrong {
  background: #FF0000;
  border: 1px solid #960000;
}

.qnumberselected {
  border: 1px solid #FFFF00;
}

.qnumberunanswered_userguide {
  border: 1px solid #D25400;
  background: #FF6600;
} 

.qnumberselected_userguide {
  color: #FFFF00;
}    

.purpletext {
  color: #C000C0;
}

.greentext {
  color: #00CC00;
}

.yellowtext {
  color: #FFB401;
}

.bluetext {
  color: #017FFF;
}

.redtext {
  color: #FF0F0F;
}

.pinktext {
  color: #FF99FF;
}

.browntext {
  color: #CC6600;
}

.whitetext {
  color: #FFFFFF;
}

/* BUTTONS for links */

a.clear-answer-link:link, a.clear-answer-link:visited, a.clear-answer-link:active 
		{
		color: #FFFFFF;
		font: 14px "PT Sans", arial, sans-serif;
		font-weight: normal;
		text-align: center;
		text-decoration: none;
		background-color: #757B93;
		padding: 6px 0px 6px 0px;
		margin: 6px auto 6px auto;		
		display: block;
		display: inline-block;
		cursor: pointer;
		width: 132px;
		border: #FFFFFF 1px solid;
  	/* CORNER ROUNDING ........ 3 by default*/
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		border-radius: 5px;
		}

a.clear-answer-link:hover
		{
		color: #FFFFFF;
		background-color: #D25400;
		border: #FFFFFF 1px solid;
		}

p.clear-answer { text-align: center;}


a.submit-answer-link:link, a.submit-answer-link:visited, a.submit-answer-link:active 
		{
		color: #FFFFFF;
		font: 14px "PT Sans", arial, sans-serif;
		font-weight: normal;
		text-align: center;
		text-decoration: none;
		background-color: #E70F1E;
		padding: 6px 0px 6px 0px;
		margin: 6px auto 6px auto;		
		display: block;
		display: inline-block;
		cursor: pointer;
		width: 132px;
		border: #FFFFFF 1px solid;
  	/* CORNER ROUNDING ........ 3 by default*/
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		border-radius: 5px;
		}

a.submit-answer-link:hover
		{
		color: #FFFFFF;
		background-color: #10AC22;
		border: #FFFFFF 1px solid;
		}

p.submit-answer { text-align: center;}


a.ask-instructor-link:link, a.ask-instructor-link:visited, a.ask-instructor-link:active 
		{
		color: #FFFFFF;
		font: 14px "PT Sans", arial, sans-serif;
		font-weight: normal;
		text-align: center;
		text-decoration: none;
		background-color: #E70F1E;
		padding: 6px 0px 6px 0px;
		margin: 6px auto 6px auto;		
		display: block;
		display: inline-block;
		cursor: pointer;
		width: 132px;
		border: #FFFFFF 1px solid;
  	/* CORNER ROUNDING ........ 3 by default*/
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		border-radius: 5px;
		}

a.ask-instructor-link:hover
		{
		color: #FFFFFF;
		background-color: #10AC22;
		border: #FFFFFF 1px solid;
		}

p.ask-instructor { text-align: center;}


a.see-explanation-link:link, a.see-explanation-link:visited, a.see-explanation-link:active 
		{
		color: #FFFFFF;
		font: 14px "PT Sans", arial, sans-serif;
		font-weight: normal;
		text-align: center;
		text-decoration: none;
		background-color: #4444FA; ;
		padding: 6px 0px 6px 0px;
		margin: 6px auto 6px auto;		
		display: block;
		display: inline-block;
		cursor: pointer;
		width: 132px;
		border: #FFFFFF 1px solid;
  	/* CORNER ROUNDING ........ 3 by default*/
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		-khtml-border-radius: 5px;
		border-radius: 5px;
		}

a.see-explanation-link:hover
		{
		color: #FFFFFF;
		background-color: #10AC22;
		border: #FFFFFF 1px solid;
		}

p.see-explanation { text-align: center;}

/*
  formulas.css (C) 2011 by Corrado Cantelmi, version 0.14 [2011-08-23]

  Original location of this file:
    http://www.webalice.it/corrado.cantelmi/html/formulas/formulas.css

  A complete explanation for these classes is found:
    http://www.webalice.it/corrado.cantelmi/html/formulas/How_to_Write_Formulas_in_HTML_and_CSS.html

  These classes are font-independent and browser independent.
  -----------------------------------------------------------

  Here is a short "how-to":
  - X  Avoid splitting an inline
       formula on two lines:         <span class="inlineformula">...your...formula...here...</span>
  - H  Write both superscript and
       subscript beside a variable:  variable<table class=supsub><tr><td>sup<br>sub</table>
  - H  Write a fraction inline:      <table class=frac><tr><td>numerator<br>&#x2013;&#x2013;&#x2013;<br>denominator</table>
  - H  Write a limit inline:         <table class=limittable><tr><td><span class=normalsize>lim</span><br>limit</table>&nbsp;function
  - H  Write a summation, a product
       or an integral inline:        <table class=big><tr><td>end<br><span class=bigmiddle>operator</span><br>start</table>rest
  - X  Write a combination inline:   <table class=comb><tr><td class=bigmiddle>(<td class=bincoef>things<br>taken<td class=bigmiddle>)</table>
  - X  Force the display of
       Unicode character:            <span class=unicode>unicode_chars</span>
  - X  Write a stand-alone formula
       with its reference number:    <table class=numfor><tr><td class=numforleft>your_formula</td><td class=numforright>ref.number</td></table>
  - X  Write a stand-alone formula
       with the <pre>:               <pre class=preformula>
                                         your
                                             formula
                                                     here
                                     </pre>

   'H' = works in "HTML 4.01 Transitional" only, NOT in XHTML
   'X' = works in "HTML 4.01 Transitional" and in "XHTML 1.0 Transitional" too
        Obviously, in XHTML you have to use the double quotes for class names and close each <td>, <tr>, etc.
*/


.inlineformula, .inlineformula .supsub, .inlineformula .big, .inlineformula .frac {   /* Used to avoid the inline formulas wrapped across lines */
	white-space: nowrap;    /* OK for Opera 10-11, Firefox 3-4, IE8, Chrome 13, Safari for iPad */
}

.supsub, .frac, .limittable, .big, .inlineformula .supsub, .comb {     /* generic class (two vertical cells) for inline polynomials */ 
	border-collapse: collapse;
	margin:          0 0.1em 0 0.05em;
	font-size:       80%;
	position:        relative;
	bottom:          -0.6em;
	line-height:      1.1em;
	display:         inline;
	text-indent:     0em;           /* Needed by Chrome which inherits any indentation from the parent <p> */
}

.bigmiddle {
	font-size:  250%;               /* SIGMA, PI, integral sign must be much greater than other chars */
	line-height: 1.2em;
}

.big {
	text-align:   center;
	bottom:      -2em;
}

.comb {                           /* used for "combinations" */
	text-align:   center;
	bottom:      -1em;
	line-height: 1.2em;
}

.bincoef {                        /* used for the binary coefficients inside the big ( and ) */
	padding-top: 0.3em;
	line-height: 1.5em;
}

.frac {                           /* centered text and different positioning for inline fractions
                                     using multiple &#x2013; chars for the fraction line*/
	text-align:   center;
	line-height:  0.9em;    /* line-height can't be less than 0.9, otherwise descending letters (gpqy) in the denominator can be cut (IE) */
	bottom:      -1.0em;
}

.limittable {                     /* class (two vertical cells) for "lim" over "x->0" */
	bottom:      -1.1em;
	text-align:  center;
}

.normalsize {
	font-size:  125%;               /* the 'lim' word should be at 100%; this compensates for the 80% in "supsub" */
}

.supsub td {
	padding:   0;
}

.numfor {                         /* Used for centered formulas with the reference number on the right */
	text-indent:   0em;
	width: 95%;
	border-collapse: collapse;
}

.numfor td {
	padding: 0 0 0 0;
}

.numforleft {                     /* Used for "numfor" left cell */
	width: 95%;
	text-align: center;
	vertical-align: middle;
}

.numfor pre, .preformula {         /* Used for "numfor" left cell (if "PRE" is used) */
	line-height: 0.7em;
}

.numforright {                    /* Used for "numfor" right cell (formula reference number) */
	text-align: right;
	vertical-align: middle;
}

.unicode {                        /* Used to force displaying Unicode chars  */
	font-family: "arial unicode ms", arial, AppleGothic;
}