table.fraction {}
table.fraction td { text-align:center; min-width:20px;  }
table.fraction td.per , table.nopadding td.per, table.nopadding th.per{ border-bottom:1px solid black;}
table.fraction td.ber , table.nopadding td.ber, table.nopadding th.ber { border-top:1px solid black}

table.table-pola {}
table.table-pola td { min-width:1em; text-align:center}

table.math td { text-align:left;  }
table.math td.ber { border-top:1px solid black}
table.math td.per { border-bottom:1px solid black}
table.math td.sign { padding-bottom:0.25em }

span.fraction  { position:relative; display:inline-block;  min-width:1em; text-align:center; white-space:nowrap; padding:0px 0px 0px 0px; top:0.75em; margin-top:-0.75em; margin-bottom:0.75em; line-height:1.5em; }
span.fraction > span:nth-child(1), span.fraction > i:nth-child(1) { left:0px; display:inline-block; position:relative; width:100%; border-bottom:1px solid black; }
span.fraction > span:nth-child(2), span.fraction > i:nth-child(2) { left:0px; display:block; position:relative; clear:both; width:100%; }
span.fraction.noline > span:nth-child(1), span.fraction.noline > i:nth-child(1) { border-bottom:none; }

.fraction .fraction { font-size:0.8em;}

sup span.fraction { position: relative;
    display: inline-block;
    min-width: 1em;
    text-align: center;
    white-space: nowrap;
    padding: 0px 0px 0px 0px;
    top: 0.45em;
	font-size:0.75em;
    margin-top: 0.5em;
    margin-bottom: -1em;}
sup span.fraction > span:nth-child(1), sup > span.fraction > i:nth-child(1) { left: 0px; display: inline-block; position: relative; width: 100%; border-bottom: 1px solid black; line-height: 1.5em;}
sup span.fraction > span:nth-child(2), sup > span.fraction > i:nth-child(2) { left: 0px; display: block; position: relative; clear: both; width: 100%; line-height: 1.5em; }
sup span.fraction.noline > span:nth-child(1), sup > span.fraction.noline > i:nth-child(1) { border-bottom:none; }


.brackets { display:inline-block; position:relative; padding-left: 0.5em; padding-right: 0.5em; }
.brackets:before { position:absolute; content:'\00a0'; top:0px; left:0px; border-style:solid; border-left-width:6px; border-image:url('bracket-left.svg') 0 0 0 100 stretch; margin-right:-0.15em; display:inline-block; height:100%}

.brackets:after {position:absolute; content:'\00a0'; top:0px;right:0px;border-style:solid; border-right-width:6px; border-image:url('bracket-right.svg') 0 100 0 0 stretch; margin-left:-0.15em;display:inline-block; height:100%;}


sup > .brackets:before {top:1em; border-left-width:3px;}
sup > .brackets:after {top:1em; border-right-width:3px;}

.brackets sup.brackets-sup { position:absolute; right:0; width:0px; top: 0.25em;  }
.brackets sub.brackets-sub { position:absolute; right:0; width:0px; bottom: 0.25em; }

span.bracket-left,
span.bracket-right {
	position:relative; top: 1em; height:2.5em;
    border-style:solid;
    margin-top: -1em;
	display:inline-block; width:0px;
}

span.bracket-left { border-left-width:6px; border-image:url('bracket-left.svg') 0 0 0 100 stretch; border-image-repeat: stretch stretch;margin-right:-0.15em}
span.bracket-right { border-right-width:6px; border-image:url('bracket-right.svg') 0 100 0 0 stretch; border-image-repeat: stretch stretch;margin-left:-0.15em}

span.bracket { font-size:2.5em; display:inline-block; position:relative; top:0.12em}
sup span.bracket { font-size:2em; display:inline-block; position:relative; top:0.1em}

.square-brackets { display:inline-block; position:relative; padding-left: 0.5em; padding-right: 0.5em; }
.square-brackets:before { position:absolute; content:'\00a0'; top:0px; left:0px; border-style:solid; border-left-width:6px; border-image:url('square-bracket-left.svg') 0 0 0 100 stretch; margin-right:-0.15em; display:inline-block; height:100%}

.square-brackets:after {position:absolute; content:'\00a0'; top:0px;right:0px;border-style:solid; border-right-width:6px; border-image:url('square-bracket-right.svg') 0 100 0 0 stretch; margin-left:-0.15em;display:inline-block; height:100%;}

span.curly { display:inline-block; position:relative; border-width:0px; margin-bottom:20px;}
span.curly > span.label { position:absolute; display:block; white-space:nowrap; font-size:smaller; padding-top:5px; width:100%; text-align:center }
.curly.left {
    border-style:solid;
	border-left-width:10px;
	border-image:url('curly-left.svg') 0 20 stretch;
}
.curly.right {
    border-style:solid;
	border-right-width:10px;
	border-image:url('curly-right.svg') 0 20 stretch;
}
.curly.top {
    border-style:solid;
	border-top-width:10px;
	border-image:url('curly-top.svg') 20 0 stretch;
}
.curly.bottom {
    border-style:solid;
	border-bottom-width:10px;
	border-image:url('curly-bottom.svg') 20 0 stretch;
}

sup.level1 {
	position:relative;
	top: -1.5em;
    display: inline-block;
}

sup.level1 > span.fraction { top:0.65em !important; }

.sqrt { margin-left: 0.75em; margin-top: 0.2em; padding-left: 0.05em;
    padding-right: 0.05em; position:relative; border-top:1px solid black; display:inline-block; line-height: 1em; }

.sqrt:after {
	position:absolute; content:'\00a0'; top:-4px; left:-0.5em; width:0px; border-style:solid; border-left-width:0.5em; height:1.55em; border-image:url('sqrt.svg') 0 0 0 100 stretch; border-image-repeat: stretch stretch; margin-right:-0.15em; display:inline-block;}

.sqrt > sup { margin-top:10px; line-height: 2em;}
.sqrt .sqrt-root-of { position:absolute;left:-1em;top:-0.5em;font-size:0.65em;}

.sqrt.sqrt-2x, .sqrt.sqrt-fraction { margin-left:1.25em; padding-left: 0.05em;
    padding-right: 0.05em;  box-sizing:border-box; }
.sqrt.sqrt-2x:before, .sqrt.sqrt-fraction:before {font-size:3em; top:0.3em; display:none;}
.sqrt.sqrt-2x:after, .sqrt.sqrt-fraction:after {
	position:absolute; content:'\00a0'; top:-4px; left:-16px; width:0px; border-style:solid; border-left-width:16px; border-image:url('sqrt.svg') 0 0 0 100 stretch; margin-right:-0.15em; display:inline-block; height:100%
}

.sqrt-2x .sqrt-root-of, .sqrt.sqrt-fraction .sqrt-root-of{ position:absolute; left:-1.25em; top:0em; font-size:0.65em;}

.matrix {position:relative; display:inline-table; margin-left:6px; margin-right:6px;}
.matrix > table {position: relative;}


.matrix > table:before { position:absolute; content:'\00a0'; top:0px; left:-6px; border-style:solid; border-left-width:6px; border-image:url('bracket-left.svg') 0 0 0 100 stretch; margin-right:-0.15em; display:inline-block; height:100%}

.matrix > table:after {position:absolute; content:'\00a0'; top:0px;right:-6px;border-style:solid; border-right-width:6px; border-image:url('bracket-right.svg') 0 100 0 0 stretch; margin-left:-0.15em;display:inline-block; height:100%;}
/*
.matrix > table:before, .matrix > table:after {
    content: "";
    position: absolute;
    top: 0;
    border: 1px solid #000;
    width: 6px;
    height: 100%;
}
.matrix > table:after {
    right: -6px;
    border-left: 0px;
}
.matrix > table:before {
    left: -6px;
    border-right: 0px;
}
*/
.matrix > table > tbody > tr > td {
    padding: 3px 5px;    
    text-align: center !important;
	vertical-align:middle !important;
}

.matrix.matrix-2 { top: 1.25em; margin-bottom: 1.25em; margin-top:-1.25em;}
.matrix.matrix-3 { top: 2.25em; margin-bottom: 2.25em; margin-top:-2.25em;}
.matrix.matrix-4 { top: 3.25em; margin-bottom: 3.25em; margin-top:-3.25em;}

.matrix.matrix-25 { top: 2em; margin-bottom: 2em; margin-top:-2em;}
.matrix.matrix-35 { top: 3em; margin-bottom: 3em; margin-top:-3em;}
.matrix.matrix-45 { top: 4em; margin-bottom: 4em; margin-top:-4em;}
