.numberline {
  font: normal 12px/16px "Helvetica", Arial, sans-serif;
}

/********************************************************************************
*									RAPHAEL									* 
********************************************************************************/
/*
*/
.numberline .canvas-container {
  position: relative;
  background-color: #ffffff;
  height: 100px;
  margin: 0 30px;
}

.numberline .grid.canvas, .numberline .elements.canvas {
  position: absolute;
  overflow: hidden;
  top: 0;
}

/********************************************************************************
*								NUMBERLINE										* 
********************************************************************************/
.numberline .help a {
  background: url(/static/img/pads/mathpad/helpIcon.png) no-repeat left;
  font-family: Arial;
  font-size: 12px;
  padding: 5px 4px 5px 18px;
  color: #333333;
  float: right;
}

.numberline img.nlLogo {
  width: 146px;
  height: 12px;
  margin-top: 7px;
  float: left;
}

.numberline span.header {
  font: normal 13px/28px verdana, helvetica, sans-serif;
}

/********************************************************************************
*							QUESTION BOX										* 
********************************************************************************/
.question {
  width: 728px;
  border: 1px solid #ccc;
  padding: 20px;
  clear: both;
}

.question .numberline {
  border: 1px solid #8d8d8d;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  width: 726px;
  position: relative;
}

.question .numberline .header,
.question .numberline .buttons,
.question .numberline .footer {
  background: #e1e2df;
  padding: 0 10px;
}

.question .numberline.key .header,
.question .numberline.key .footer {
  background: #b5d3b5;
}

.question .numberline .header {
  color: #383838;
  height: 29px;
  display: block;
  line-height: 29px;
}

.question .numberline .jxgbox {
  height: 100px;
  width: 660px;
  margin: 0 30px;
  border: none;
}

.question .numberline .footer {
  height: 25px;
  overflow: hidden;
}

.question .numberline .footer p {
  line-height: 25px;
}

.footer p.logo {
  float: left;
}

.footer p.help {
  float: right;
}

.question .numberline .footer.topBorder {
  border-top: 1px solid #8D8D8D;
}

.question .numberline.key .footer.topBorder {
  border-top: 1px solid #070;
}

.question .numberline hr.flagSeparator {
  color: #8D8D8D;
  position: absolute;
  bottom: 170px;
  width: 100%;
  display: none;
}

.question .numberline .buttons ul li a {
  background: -moz-linear-gradient(-45deg, white 0%, #d9d9d6 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, white), color-stop(100%, #d9d9d6));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(-45deg, white 0%, #d9d9d6 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(-45deg, white 0%, #d9d9d6 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(-45deg, white 0%, #d9d9d6 100%);
  /* IE10+ */
  background: linear-gradient(-45deg, white 0%, #d9d9d6 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#d9d9d6',GradientType=1 );
  /* IE6-8 fallback on horizontal gradient */
}

.question .numberline .buttons ul li a.selected, .question .numberline .buttons ul li a.noHoldBtn:not(.disabled):active {
  background: -moz-linear-gradient(top, #456b90 0%, #134271 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #456b90), color-stop(100%, #134271));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #456b90 0%, #134271 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #456b90 0%, #134271 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #456b90 0%, #134271 100%);
  /* IE10+ */
  background: linear-gradient(top, #456b90 0%, #134271 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#456b90', endColorstr='#134271',GradientType=0 );
  /* IE6-8 */
}

.question .numberline .tooltip .buttons ul.figures li a.closePoint.noHoldBtn:not(.disabled):active,
.question .numberline .tooltip .buttons ul.figures li a.openPoint.noHoldBtn:not(.disabled):active {
  background: -moz-linear-gradient(top, #456b90 0%, #134271 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #456b90), color-stop(100%, #134271));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #456b90 0%, #134271 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #456b90 0%, #134271 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #456b90 0%, #134271 100%);
  /* IE10+ */
  background: linear-gradient(top, #456b90 0%, #134271 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#456b90', endColorstr='#134271',GradientType=0 );
  /* IE6-8 */
}

.disabled {
  cursor: default;
  opacity: 0.2;
}

/* NO SOLUTION - BLOCK BOARD*/
.question .numberline .noSolutionScreen,
.question .numberline .blockBoard {
  background: #fff;
  display: none;
  height: 100px;
  opacity: 0.3;
  position: absolute;
  top: 30px;
  width: 100%;
  z-index: 99;
}

.question .numberline .noSolutionScreen p {
  color: #000;
  font-size: 50px;
  font-weight: bold;
  margin-top: 50px;
  text-transform: uppercase;
  text-align: center;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
}

/* NO SOLUTION */
.question .numberline .header {
  border-bottom: 1px solid #8d8d8d;
}

.question .numberline.key .header {
  border-bottom: 1px solid #070;
}

.question .numberline .buttons {
  padding: 7px 10px;
  border-bottom: 1px solid #8d8d8d;
  border-top: 1px solid #8d8d8d;
  overflow: hidden;
  vertical-align: middle;
}

.question .numberline .noSolutionScreen.flagNS,
.question .numberline .canvas-container.flagNS {
  height: 200px;
}

.question .numberline .noSolutionScreen.flagNS p {
  margin-top: 140px;
}

/********************************************************************************
*							BUTTONS: GENERAL									* 
********************************************************************************/
.question .numberline .buttons ul {
  margin: 0;
  padding: 0;
  float: left;
}

.question .numberline .buttons ul li {
  display: inline-block;
  vertical-align: top;
}

.question .numberline .buttons ul.tools.pointtypes {
  border-left: 1px solid #4d4d4d;
  padding-left: 10px;
}

.question .numberline .buttons ul.tools li {
  margin-right: 10px;
}

.question .numberline .buttons ul.tools.right {
  float: right;
}

.question .numberline .buttons ul.tools.right li {
  margin-right: 0px;
}

.question .numberline .buttons a.action {
  border: solid 1px #4d4d4d;
  color: #000;
  display: block;
  font-size: 18.6pt;
  height: 26px;
  line-height: 22px;
  overflow: hidden;
  text-decoration: none;
  text-align: center;
  width: 26px;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
}

.question .numberline .buttons a.action.selected span,
.question .numberline .buttons a.noHoldBtn:not(.disabled):active {
  color: #FFF;
}

.question .numberline .buttons a.noSol {
  float: right;
  font-size: 9px;
  border: solid 1px #4d4d4d;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  background: -moz-linear-gradient(-45deg, white 0%, #d9d9d6 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, white), color-stop(100%, #d9d9d6));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(-45deg, white 0%, #d9d9d6 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(-45deg, white 0%, #d9d9d6 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(-45deg, white 0%, #d9d9d6 100%);
  /* IE10+ */
  background: linear-gradient(-45deg, white 0%, #d9d9d6 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#d9d9d6',GradientType=1 );
  /*	IE6-8 */
}

.question .numberline .buttons a.noSol.selected {
  background: -moz-linear-gradient(top, #456b90 0%, #134271 100%);
  /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #456b90), color-stop(100%, #134271));
  /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #456b90 0%, #134271 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #456b90 0%, #134271 100%);
  /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #456b90 0%, #134271 100%);
  /* IE10+ */
  background: linear-gradient(top, #456b90 0%, #134271 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#456b90', endColorstr='#134271',GradientType=0 );
  /* IE6-8 */
}

.question .numberline .buttons a.noSol span {
  display: block;
  height: 10px;
  line-height: 16px;
}

/********************************************************************************
*								BUTTONS: TOOLS									* 
********************************************************************************/
ul.tools li a span, ul.figures li a span {
  display: inline-block;
  width: 28px;
  height: 28px;
}

.question .numberline .buttons ul.tools li a.cursor span {
  background: url("/static/img/pads/numberline/buttons/select.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.cursor.selected span {
  background: url("/static/img/pads/numberline/buttons/selectW.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.draw span {
  background: url("/static/img/pads/numberline/buttons/pencil.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.draw.selected span {
  background: url("/static/img/pads/numberline/buttons/pencilW.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.erase span {
  background: url("/static/img/pads/numberline/buttons/eraser.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.erase.selected span {
  background: url("/static/img/pads/numberline/buttons/eraserW.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.undo span {
  background: url("/static/img/pads/numberline/buttons/undo.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.undo:not(.disabled):active span {
  background: url("/static/img/pads/numberline/buttons/undoW.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.clear span {
  background: url("/static/img/pads/numberline/buttons/trash.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.clear:not(.disabled):active span {
  background: url("/static/img/pads/numberline/buttons/trashW.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.closePoint span,
.question .numberline .buttons ul.figures li a.closePoint span {
  background: url("/static/img/pads/numberline/buttons/pointClosed.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.closePoint.selected span,
.question .numberline .buttons ul.figures li a.closePoint.selected span,
.question .numberline .buttons ul.figures li a.closePoint:active span {
  background: url("/static/img/pads/numberline/buttons/pointClosedW.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.openPoint span,
.question .numberline .buttons ul.figures li a.openPoint span {
  background: url("/static/img/pads/numberline/buttons/pointOpen.png") 0 0 no-repeat;
}

.question .numberline .buttons ul.tools li a.openPoint.selected span,
.question .numberline .buttons ul.figures li a.openPoint.selected span,
.question .numberline .buttons ul.figures li a.openPoint:active span {
  background: url("/static/img/pads/numberline/buttons/pointOpenW.png") 0 0 no-repeat;
}

/* TOOL TIP */
.question .numberline .tooltip {
  border: 1px solid #000;
  display: none;
  position: absolute;
  top: -20px;
  z-index: 99999;
}

.question .numberline .tooltip .buttons {
  background: #fff;
}

.question .numberline .tooltip .buttons ul.figures li {
  margin: 0;
}

.question .numberline .tooltip .buttons ul.figures li a.action {
  border: 1px solid #4d4d4d;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
}

.question .numberline .jxgbox svg g rect {
  opacity: 0;
}

/********************************************************************************
*										ANSWER									* 
********************************************************************************/
/*.answer {margin: 20px 0 0 20px; width: 728px; position: relative;}
.answer .numberline{ 
		border: 1px solid #5ea456;
	
		-webkit-border-radius:5px;
		-moz-border-radius:5px;
		border-radius:5px;
		width: 726px;
		position:relative;
		}
.answer .numberline .header { border-bottom: 1px solid #5ea456;}
.answer .numberline .header, .answer .numberline .footer{ background: #b6d3b4; padding: 0 10px; }
		.answer .numberline .footer{ border-top: 1px solid #5ea456;}

.answer .solution{ overflow: hidden; border: 1px solid #5ea456; margin-top: 20px; min-width: 10px;}
		.answer .solution p.keySol{ float: left; background: #b6d3b4; margin-right: 5px;}
		.answer .solution p.stringSol{ float: left; color:#5ea456;  }*/
.container .question .numberline .buttons ul li a.dontRun {
  opacity: 0.2;
}