/*
    Rabih Kaddour
    http://kaddour-es.de/
    August, 2016.
*/

/****************************************** Table ****************************************************************/
.table-centered {
    position:relative; 
    /*width:100%;
    height:100%;*/
    width:760px;
    text-align:center; 
    vertical-align:middle;
    background-color:#87CEFA;
    /*z-index: 9999;*/
}

/**************************************** Frame *****************************************************************/

.fiveCell-single {
    position: relative;
    margin-right: 24px;
    margin-bottom: 12px;
    display: inline-block;
    /*background-color:#09F;*/
    border: 2px solid #09F;
    cursor: default;
    vertical-align: top;
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

/*.fiveCell-single:hover {
    border: 4px solid #4800ff;
}*/

.cell-table-10 {
	position:relative;
	height:81px;
	width:81px;
	margin:2px;
	display:inline-block;
    visibility:hidden;
}

.cell-table {
	position:relative;
	height:100px;
	width:100px;
	margin:2px;
	display:inline-block;
	/*border:3px solid #f1fafe;*/
	/*background-color:#f1fafe;*/
    visibility:hidden;
}

.tenCell-single {
	position:relative;
	margin-right:24px;
	margin-bottom:12px;
	display:inline-block;
	/*background-color:#bee8fb;*/
	/*border:2px solid #bee8fb;*/
    background-color:#09F;
	border:2px solid #09F;
	cursor:default;
	vertical-align:top;
	-moz-user-select:-moz-none;
	-khtml-user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

.tenCell-single:last-child {
	margin-right:0
}

.cellNavi {
	position:relative;
	margin-right:24px;
	margin-bottom:12px;
	display:inline-block;
    background-color:#09F;
	/*border:1px solid #09F;*/
	cursor:default;
	vertical-align:top;
	-moz-user-select:-moz-none;
	-khtml-user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

.tenCell-numbers {
	position:relative;
	margin-right:24px;
	margin-bottom:12px;
	display:inline-block;
	/*background-color:#bee8fb;*/
	/*border:2px solid #bee8fb;*/
    background-color:#09F;
	border:1px solid #09F;
	cursor:default;
	vertical-align:top;
	-moz-user-select:-moz-none;
	-khtml-user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
	user-select:none;
}

.tenCell-table-numbers {
	position:relative;
	height:64px;
	width:167px;
    line-height:64px; /* todo */
	margin:2px;
	display:inline-block;
	border:1px solid #f1fafe;
	background-color:#f1fafe;
}

.size_rescale {
    width:64px;
    height:64px;
    line-height:64px;
}

.spnTxt { 
    text-decoration-line: underline;
    text-decoration-style: wavy;
    text-decoration-color: red;
}

.tenCell-table {
	position:relative;
	height:64px;
	width:64px;
    line-height:64px; /* todo */
	margin:2px;
	display:inline-block;
	border:3px solid #f1fafe;
	background-color:#f1fafe;
}
.tenCell-table.highlighted {
	border:3px solid #fff;
	background-color:#f1f1f1
}
.tenCell-single.muted {
	background-color:#e8f7fe;
	border:2px solid #e8f7fe;
}
.tenCell-single.border-none {
    border:none;
}
.tenCell-table.tborder-none {
    border:none;
}
.tenCell-table.resize {
    height: 48px;
    width: 48px;
    text-align: center;
}

.tenCell-table.resize57 {
    height: 50px;
    width: 50px;
    text-align: center;
    /*background-color: #87CEFA;*/
}

.tenCell-table.resize120 {
	height:120px;
	width:120px;
    text-align:center;
    background-color:#87CEFA;
}

.tenCell-table.resize180 {
	height:180px;
	width:180px;
    text-align:center;
    background-color:#87CEFA;
}

.muted .tenCell-table {
	border-color:#fafdff;
	background-color:#fafdff;
}

.tenCell-table .QMImage,.tenCell-table .cell-child .cell-child-ans,.tenCell-table svg {
	vertical-align:middle;
    text-align: center;
    vertical-align: central; /* <-- fix the vertical gap */
	height:inherit;
	width:inherit;
	-moz-user-select:none;
	-webkit-user-drag:none
}

.tenCell-single.muted .cell-child .cell-child-ans, .tenCell-single.muted .tenCell-table .QMImage,.tenCell-single.muted .tenCell-table svg {
	opacity:.4;
	filter:alpha(opacity=40)
}

.cell-child.hidden {
	visibility:hidden;
}

.cell-child-ans.hidden {
	visibility:hidden;
}

.tenFrames-badge {
	position:relative;
	left:47%;
	bottom:135%;
	z-index:1
}

.tenFrames-badge.full {
	position:absolute;
	left:-5%;
	top:-5%
}

.tenCell-single.labeled {
	margin-bottom:80px
}

.tenFrames-label {
	position:absolute;
	top:105%;
	left:calc(50% - 71px/2)
}

.transformAndCombine .table {
	display:table
}

.transformAndCombine .row {
	display:table-row
}

.transformAndCombine .cell {
	display:table-cell
}

.transformAndCombine .cell.left {
	text-align:left;
	padding-right:10px
}

.transformAndCombine .cell.center {
	text-align:center;
	padding-right:10px
}

.transformAndCombine .cell.right {
	text-align:left;
	padding-left:10px;
	padding-right:10px
}

.transformAndCombine .cell.rightLeft {
	text-align:right;
	padding-left:10px
}
.transformAndCombine .cell.rightComparison {
	text-align:center
}

.transformAndCombine .cell.rightRight {
	text-align:left;
	padding-right:10px
}

.transformAndCombine .firstCombined {
	border-top:1px solid
}

.transformationList.table {
	display:table
}

.transformationList .row {
	display:table-row
}
.transformationList .cell {
	display:table-cell;
	border-bottom:5px solid transparent
}

.transformationList .cell.left {
	text-align:left;
	padding:0 10px 0 0
}

.transformationList .cell.center {
	text-align:center
}
.transformationList .cell.right {
	text-align:left;
	padding:0 0 0 10px
}

.treeTable {
	text-align:center
}

.treeRow {
	width:180px
}

.treeCol {
	width:90px
}

.treeRight {
	float:right
}

.treeCol>.arrow {
	width:25px;
	height:25px;
	position:relative
}

.triName {
	display:inline-block;
	font-family:"IXL Verdana",Verdana,Arial,Helvetica,sans-serif
}

.triName>.name {
	display:inline-block;
	font-style:italic
}

.unaryPrefixOperator {
	display:inline-block;
	white-space:nowrap
}

.unaryPrefixOperator>.argument,.unaryPrefixOperator>.opSymbol {
	display:inline-block
}

.underlineLastDigits>u.underlined {
	text-decoration:none;
	border-bottom:2px solid
}

.unitSquareContainer {
	padding:10px;
	position:relative;
	left:30px;
	display:inline-block
}

.verticalTransformation.table {
	display:table
}

.verticalTransformation .row {
	display:table-row
}

.verticalTransformation .cell {
	display:table-cell;
	padding:0 3px;
	border-bottom:5px solid transparent
}

.verticalTransformation .cell.left {
	text-align:left
}

.verticalTransformation .cell.center {
	text-align:center
}

.bundle {
	display:inline-block;
	white-space:nowrap
}

.barLabel.xAxisScaleLabel {
	word-wrap:normal
}

.cLabel {
	font-size:12px
}

.cLabel .binaryOperator {
	margin-left:0;
	margin-right:0
}

.gridLabel {
	font-size:75%;
	white-space:nowrap
}

.xAxisScaleLabel,.yAxisScaleLabel:not(.rotated) {
	color:#353535;
	word-wrap:break-word;
	white-space:normal;
	max-width:100px
}

.xAxisScaleLabel.rotated,.yAxisScaleLabel {
	text-align:right
}

.xAxisScaleLabel:not(.rotated) {
	text-align:center
}

.originLabel:not(.numberLineLabel)>.itsAboutMe {
	font-size:125%
}

.xAxisScaleLabel:not(.numberLineLabel)>.itsAboutMe {
	font-size:125%;
	position:relative;
	top:-1px
}

.yAxisScaleLabel:not(.numberLineLabel)>.itsAboutMe {
	font-size:125%;
	position:relative;
	left:2px
}

.measurementLabel {
	font-size:12px
}

.numberLineLabel {
	font-size:14px
}

.xAxisScaleLabel.numberLineLabel {
	padding-top:2px
}

.yAxisScaleLabel.numberLineLabel {
	padding-right:2px
}

.numberLineSegmentLabel {
	color:#09F
}

.gridLabel.numberLineLabel .vFrac {
	font-size:90%
}

.gridLabel.xAxisScaleLabel:not(.numberLineLabel) .vFrac {
	font-size:inherit
}
.numberLineSegmentLabel .vFrac>.fracLine {
	background-color:#09F
}

.gridLabel .qm-limit {
	font-size:120%
}

.rotatedLabel {
	font-size:75%;
	-webkit-transform:rotate(-90deg);
	-webkit-transform-origin:top right;
	-moz-transform:rotate(-90deg);
	-ms-transform:rotate(-90deg);
	-o-transform:rotate(-90deg);
	filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3)
}
.gridLabel.axisTitleLabel {
	text-align:center;
	white-space:normal
}
.graphTitleLabel {
	font-weight:700;
	font-size:16px
}
.expressionLabel {
	font-size:12px
}
.expressionLabel .binaryOperator {
	margin-left:0;
	margin-right:0
}
.rectangleEdgeLabelBackground {
	background-color:#fff;
	position:absolute;
	z-index:-999
}
.rectangleEdgeLabelBackground.horizontal {
	height:10px;
	left:-10px
}
.rectangleEdgeLabelBackground.vertical {
	width:10px
}
.rectangleEdgeLabel {
	font:700 16px verdana;
	color:#565656
}
.rectangleEdgeLabel.hidden {
	font:700 19px verdana
}
.rectangleEdgeLabelBackground.rotated {
	-ms-transform:rotate(-90deg);
	-webkit-transform:rotate(-90deg);
	transform:rotate(-90deg)
}
.rectangleAreaLabel {
	font:700 18px verdana;
	color:#4a4a4a
}
.numberline-marker-label {
	color:#09F
}
.numberline-marker-label.counting {
	font-size:75%
}
.numberline-marker-label.addition-subtraction {
	font-size:87.5%
}
.numberline-marker-label.addition-subtraction .negSign .negSymbol {
	display:inline-block
}
.numberline-marker-label .scalar-fraction>.scalar-fraction-bar>.visible-fraction-bar {
	background-color:#09F
}
.numberline-addition-marker-label {
	font-size:87.5%;
	font-family:Verdana,Geneva,sans-serif
}
.numberline-addition-marker-label.first {
	color:#335ca5
}
.numberline-addition-marker-label.firstFaded {
	color:#93a3bf;
	opacity:.45
}
.numberline-addition-marker-label.second {
	color:#57a028
}
.numberline-addition-marker-label.secondFaded {
	color:#94bb79;
	opacity:.5
}
.diagramLabelContainer .quadrant-label {
	padding:5px
}
.sLabel {
	font-size:12px;
	width:110%
}
.sLabel .binaryOperator {
	margin-left:0;
	margin-right:0
}
.dLabel.smart2DShapeLabel {
	font-weight:700;
	opacity:.7
}
.dLabel.smart2DShapeLabel.cardinalStyling {
	opacity:1
}
.dLabel.smart2DShapeLabel.annotationLabel {
	font-weight:400;
	color:#545454;
	position:relative;
	top:-2px
}
.vectorLabel {
	font-size:12px
}
.point {
	white-space:nowrap;
	display:inline-block
}
.innerPoint {
	display:inline-block
}
.pointSeparator {
	white-space:nowrap;
	padding-right:6px
}
.pointSeparator.forFraction {
	padding-left:3px
}
.blink-on {
	visibility:visible;
}
.blink-off {
	visibility:hidden;
}

