/*This is Lemma editor css-style sheet*/
/*This stylesheet rendes the text written by Lemma editor to readable form for webuser*/ 
/*The newest copy of the stylesheet can be downloaded from https://www.lemma.fi/mathstyles.css */

/*Computer Modern Serif-fontit */

@font-face {
	font-family: 'Computer Modern Serif';
	font-style: normal;
	font-weight: normal;
	src: url('https://www.lemma.fi/pages/fonts/latinmodern-math.woff') format('woff'),
	local('Times');
	unicode-range: U+0000-2100, U+2150-1F003;
	font-display: swap;
}

/*emojit ja muut erikoismerkit timesilla*/
@font-face {
	font-family: 'Computer Modern Serif';
	font-style: normal;
	font-weight: normal;
	src: local('Times');
	unicode-range: U+1F004-1FFFF;
}

/*bold*/
@font-face {
	font-family: 'Computer Modern Serif';
	font-style: normal;
	font-weight: bold;
	ascent-override: 80.6%;
	src: url('https://www.lemma.fi/pages/fonts/cmunbx.ttf') format('truetype'),
	local('Times');
	unicode-range: U+0000-03B7, U+03B9-1F003;
	font-display: swap;
}

/*bold equals, not identical, theta, emojit */
@font-face {
	font-family: 'Computer Modern Serif';
	font-style: normal;
	font-weight: bold;
	ascent-override: 80.6%;
	src: local('Cambria Math'), local('Times');
	unicode-range: U+003D, U+2249, U+2262, U+226E-2271, U+1F004-1FFFF;
}


/*italic*/
@font-face {
	font-family: 'Computer Modern Serif';
	font-style: italic;
	font-weight: normal;
	ascent-override: 80.6%;
	src: url('https://www.lemma.fi/pages/fonts/cmunti.woff2') format('woff2'),
	local('Times');
	unicode-range: U+0000-036F, U+0400-1F003;
	font-display: swap;
}

/*kreikkalaiset slantted*/
@font-face {
	font-family: 'Computer Modern Serif';
	font-style: italic;
	font-weight: normal;
	src: url('https://www.lemma.fi/pages/fonts/cmunsl.woff2') format('woff2'),
	local('Times');
	unicode-range: U+0370-03B7, U+03B9-03FF;
	font-display: swap;
}

/*italic not equal, not identical */
@font-face {
	font-family: 'Computer Modern Serif';
	font-style: italic;
	font-weight: normal;
	src: local('Cambria Math'), local('Times');
	unicode-range: U+03B8, U+2249, U+2260, U+2262, U+2270, U+2271, U+1F004-1FFFF;
}

/*italic bold*/
@font-face {
	font-family: 'Computer Modern Serif';
	font-style: italic;
	font-weight: bold;
	ascent-override: 80.6%;
	src: url('https://www.lemma.fi/pages/fonts/cmunbi.woff2') format('woff2'),
	local('Times');
	unicode-range: U+0000-03B7, U+03B9-1F003;
	font-display: swap;
}


/*italic bold not equal, not identical*/
@font-face {
	font-family: 'Computer Modern Serif';
	font-style: italic;
	font-weight: bold;
	ascent-override: 80.6%;
	src: local('Cambria Math'), local('Times');
	unicode-range: U+003D, U+03B8, U+2249, U+2260, U+2262, U+2270, U+2271, U+1F004-1FFFF;
}

/* matikka  (math)*/
.editori {
font-style: normal;
}

/*editorin rivit*/
.lmrow {
font-family: 'Computer Modern Serif', Times, 'Times New Roman';
font-variant-ligatures: none;
letter-spacing: 0;
line-height: 1.15;
width: 100%;
white-space: pre-wrap;
}

.lmtext {
width: 100%;
}

.lmchar {
display: inline;
line-height: 1.15;
}

.nospace {
letter-spacing: 0 !important;
}

.pois {
white-space: pre;
}

.merkattu {
background-color: yellow;
}

/*rivien ja solujen tasaus*/
.vasemmalle {
text-align: left;
}

.keskelle {
text-align: center;
}

.oikealle {
text-align: right;
}


.vakiot {
font-family: 'Computer Modern Serif';
font-style: italic;
letter-spacing: 0.02em;
text-align: center;
text-align-last: center;
width: 100px;
}


.muuttuja {
font-family: 'Computer Modern Serif';
font-style: italic;
letter-spacing: 0.02em;
text-align-last: center;
}

/*koordinaatistoon piirtamat tekstit*/
.matpiirto {
display: inline;
font-family: 'Computer Modern Serif';
font-weight: normal;
break-inside: avoid;
text-indent: 0;
white-space: nowrap;
}

/* piirtosovelluksen funktioiden kirjoitus matikat*/
.fat {
font-family: 'Computer Modern Serif';
font-size: 20px;
font-style:normal;
font-variant-ligatures: none;
font-weight: normal;
break-inside: avoid;
text-align: left;
text-indent: 0;
white-space: nowrap;
word-wrap: break-word;
}


/*editorin kuvaluokka*/
.kuva {
background: white;
display: inline-block;
line-height: 0.1em;
margin-left: 2px;
margin-right: 2px;
overflow: hidden;
resize: vertical;
text-indent: 0;
}

.kuva img {
width: 100%;
height: 100%;
}

.canvas {
height: var(--canvasheight, 1.2em);
width: var(--canvaswidth, 0.4em);
}

/*editing styles*/
.yliviiva {
text-decoration: line-through;
text-decoration-style: solid;
text-decoration-color:  var(--yliviivacolor, red);
text-decoration-thickness: 0.1em;
}

.alleviiva {
text-decoration: underline;
text-decoration-style: solid;
text-decoration-color: var(--alleviivacolor, inherit);
text-decoration-skip-ink: none;
text-decoration-thickness: 0.1em;
}

.paaliviiva {
text-decoration: overline;
text-decoration-style: solid;
text-decoration-color: var(--paaliviivacolor, inherit);
text-decoration-thickness: 0.1em;
}

.ylialiviiva {
text-decoration: line-through underline;
text-decoration-style: solid;
text-decoration-color: var(--ylialiviivacolor, inherit);
text-decoration-skip-ink: none;
text-decoration-thickness: 0.1em;
}

.ylipaaliviiva {
text-decoration: line-through overline;
text-decoration-style: solid;
text-decoration-color: var(--ylipaaliviivacolor, inherit);
text-decoration-thickness: 0.1em;
}

.alipaaliviiva {
text-decoration: underline overline;
text-decoration-style: solid;
text-decoration-color: var(--alipaaliviivacolor, inherit);
text-decoration-skip-ink: none;
text-decoration-thickness: 0.1em;
}

.ylialipaaliviiva {
text-decoration: line-through underline overline;
text-decoration-style: solid;
text-decoration-color: var(--ylialipaaliviivacolor, inherit);
text-decoration-skip-ink: none;
text-decoration-thickness: 0.1em;
}

.italic {
font-style: italic;
letter-spacing: 0.05em;
font-kerning: none;
}

/*jotkin tarvitsevat marginaalia*/
.lspace {
padding-left: 0.2em;
}

.rspace {
padding-right: 0.2em;
}

.lmup {
vertical-align: 0.08em;
}

.font9 {
font-size: 9px;
}

.font11 {
font-size: 11px;
}

.font12 {
font-size: 12px;
}

.font14 {
font-size: 14px;
}

.font16 {
font-size: 16px;
}

.font17 {
font-size: 17px;
}

.font18 {
font-size: 18px;
}

.font20 {
font-size: 20px;
}

.font22 {
font-size: 22px;
}

.font24 {
font-size: 24px;
}

.font26 {
font-size: 26px;
}

.font28 {
font-size: 28px;
}

.font30 {
font-size: 30px;
}

.font32 {
font-size: 32px;
}

.font34 {
font-size: 34px;
}

.font40 {
font-size: 40px;
}

.font44 {
font-size: 44px;
}

.font48 {
font-size: 48px;
}

.fontxxxsmall {
font-size: 0.5em;
}

.fontxxsmall {
font-size: 0.625em;
}

.fontxsmall {
font-size: 0.75em;
}

.fontsmall {
font-size: 0.875em;
}

.fontmedium {
font-size: 1em;
}

.fontlarge {
font-size: 1.125em;
}

.fontxlarge {
font-size: 1.25em;
}

.fontxxlarge {
font-size: 1.5em;
}

.fontxxxlarge {
font-size: 2em;
}

.fontxxxxlarge {
font-size: 3em;
}

.fontbig {
font-size: 1.67em;
}

.prime {
--vertical: 0.08em;
--horizontal: -0.05em;
}

.prime::before {
content: "'";
display: inline-block;
font-style: italic;
margin-left: var(--horizontal);
position: relative;
vertical-align: var(--vertical);
}

.bold {
font-weight: bold;
}

.puna {
color: red;
}

.oranssi {
color: orange;
}

.kelta {
color: yellow;
}

.lime {
color: lime;
}

.vihrea {
color: green;
}

.harmaa {
color: grey;
}

.syaani {
color: cyan;
}

.sini {
color: blue;
}

.fuchsia {
color: fuchsia;
}

.violetti {
color: purple;
}

.ruskea {
color: brown;
}

.valko {
color: white;
}

.arial {
font-family: 'Arial';
}

.times {
font-family: 'Times';
}

.courier {
font-family: 'Courier New';
}

/*editorin normitaulukko*/
.editaulukko {
background-color: var(--taulubgcolor, transparent);
border-collapse: collapse;
border-color: var(--taulucolor, black);
border-style: var(--taulustyle, solid);
border-width: var(--tauluwidth, 0.15em);
font-family: 'Computer Modern Serif';
margin: 0.1em;
outline-color: transparent;
outline-style: solid;
padding: 0.06em;
white-space: pre-wrap;
}

.editaulukko tr, 
.editaulukko td {
border-color: var(--taulucolor, black);
border-style: var(--taulustyle, solid);
border-width: var(--taulusisawidth, 0.1em);
}

.odd tr:nth-child(odd){
background-color: var(--tauluoddcolor, transparent);
}

.even tr:nth-child(even){
background-color: var(--tauluevencolor, transparent);
}

/*vastaus taulukko*/
.vastaustaulukko {
border: none;
background-color: aqua;
}

.vastauslaatikko tbody, .vastaustaulukko tbody {
border: none;
background-color: aqua;
}

.vastauslaatikko {
background-color: aqua;
border: none;
font-family: 'Computer Modern Serif';
margin: 0.1em 0;
outline-style: none;
padding: 0;
}

.vastauseka td {
border: none;
}

.v0::before {
content:'';
pointer-events: none;
}

.v1::before {
content:'a)';
pointer-events: none;
}

.v2::before {
content:'b)';
pointer-events: none;
}

.v3::before {
content:'c)';
pointer-events: none;
}

.v4::before {
content:"d)";
pointer-events: none;
}

.v5::before {
content:'e)';
pointer-events: none;
}

.v6::before {
content:'f)';
pointer-events: none;
}

.v7::before {
content:'g)';
pointer-events: none;
}

.v8::before {
content:'h)';
pointer-events: none;
}

.rivi {
background-color: transparent;
}

.solu {
background-color: transparent;
font-size: inherit;
min-width: 20px;
padding: 0.1em 0.2em;
vertical-align: baseline;
white-space: pre;
}

.eireunaa {
border: none;
outline: none;
margin: 0;
}

/*editorin merkkikaavio*/
.merkkikaavio {
background-color: transparent;
border-collapse: collapse;
border-color: black;
border-style: solid;
border-width: var(--kaaviowidth, 0.1em);
font-family: 'Computer Modern Serif';
margin: 0.1em;
outline-color: transparent;
outline-style: solid;
padding: 0.06em;
}

.ksolu {
background-color: transparent;
font-size: inherit;
min-width: 20px;
vertical-align: baseline;
}

.otsikkosolu {
border-right-color: red;
border-width: var(--kaaviowidth, 0.1em);
text-align: left;
}

.ekasolu {
border-width: var(--kaaviowidth, 0.1em);
text-align: left;
}

.nollaraja {
border-right-color: red;
border-right-style: solid;
border-width: var(--kaaviowidth, 0.1em);
}

.vikasolu {
border-left-color: red;
border-left-style: solid;
border-width: var(--kaaviowidth, 0.1em);
}

.nollakohta {
background-color: transparent;
border-bottom-color: red;
border-bottom-style: solid;
border-left-color: red;
border-left-style: solid;
border-right-color: red;
border-right-style: solid;
border-width: var(--kaaviowidth, 0.1em);
font-size:inherit;
text-align:center;
}

.nollakohtavika {
border-bottom-color: red;
border-bottom-style: solid;
border-left-color: red;
border-left-style: solid;
border-right-color: red;
border-right-style: solid;
border-width: var(--kaaviowidth, 0.1em);
text-indent: -33%;
}

/*matriisi*/
.matriisi {
background-color: transparent;
display: inline-block;
margin-left: 0.1em;
margin-right: 0.1em;
outline-color: transparent;
outline-style: solid;
position: relative;
vertical-align: middle;
text-indent: 0;
}

.matriisiauki, .matriisikiinni {
background-color: transparent;
display: inline-block;
height: calc(100% - 0.1em);
position: absolute;
top: 0;
}

.matriisiauki {
border-color: var(--maaukicolor, black);
border-style: solid;
border-width: 0.075em 0 0.075em 0.085em;
left: 0;
width: 0.2em;
}

.matriisikiinni {
border-color: var(--makiinnicolor, black);
border-style: solid;
border-width: 0.075em 0.085em 0.075em 0;
right: 0;
width: 0.2em;
}

.matriisisisus {
background-color: transparent;
display: inline-table;
margin-left: 0.1em;
margin-right: 0.1em;
outline-color: transparent;
outline-style: solid;
padding-left: 0.2em;
padding-right: 0.2em;
vertical-align: middle;
}

.matriisirivi {
background-color: transparent;
display: table-row;
text-align: center;
}

.matriisisolu {
background-color: transparent;
border-style: solid;
border-width: 0.1em;
border-color: var(--masolucolor, white);
display: table-cell;
padding-left: 0.1em;
padding-right: 0.1em;
text-align: center;
}


.merkki {
text-align: center;
}

/* matikan rivit */
.row {
text-align: center;
vertical-align: 0;
white-space: pre;
}

/*jakolasku*/
.frac {
border-collapse: collapse;
display: inline-table;
font-size: 0.9em;
margin-left: calc(1px + 0.02em);
margin-right: calc(2px + 0.05em);
outline-color: transparent;
outline-style: solid;
text-align: center;
text-indent: 0;
vertical-align: 50%;
}

.oso, .nim {
background-color: inherit;
outline-color: inherit;
outline-style: solid;
}

.oso {
display: inline-table;
margin: auto;
text-align: center;
vertical-align: bottom;
width: calc(100% + 3px);
}

.nim {
border-color: var(--nimcolor, black);
border-top-style: solid;
border-top-width: 0.07em;
display: block;
margin: auto;
text-align: center;
width: calc(100% + 3px);
}


/* aput toimivat chromen kursorin sovittajana ja safarin kursorin liikeapuna */ 
.blockapu {
background-color: inherit;
border-spacing: 0;
display: block;
margin: auto;
padding-bottom: 1px;
padding-top: 1px;
text-align: center;
width: 100%;
}

.tableapu {
background-color: inherit;
border-spacing: 0;
display: table;
margin: auto;
text-align: center;
width: 80%;
}

.supistusapu {
background-color: inherit;
display: inline-block;
text-align: right;
width: 100%;
}


.supistusviiva {
background-color: transparent;
border-spacing: 0;
border-left: 0.1em solid;
border-left-color: var(--sucolor, black);
border-top-left-radius: 50%;
border-bottom-left-radius: 50%;
display: inline-block;
height: 0.9em;
pointer-events: none;
position: relative;
top: 3px;
left: 0.7em;
width: 0.7em;
transform: rotate(-35deg);
transform-origin: bottom;
}

.lavennuskeraaja, .supistuskeraaja {
display: flex;
}

.lavennuskeraaja {
margin-right: -0.4em;
}

.supistuskeraaja {
margin-left: -0.4em;
}

.lavennusapu {
background-color: inherit;
display: inline-block;
text-align: left;
width: 100%;
}

.lavennusviiva {
background-color: transparent;
border-spacing: 0;
border-right: 0.1em solid;
border-right-color: var(--lacolor, black);
border-top-right-radius: 50%;
border-bottom-right-radius: 50%;
display: inline-block;
height: 0.9em;
pointer-events: none;
position: relative;
top: 3px;
right: 0.7em;
width: 0.7em;
transform: rotate(35deg);
transform-origin: bottom;
}

/*alaindeksi*/
.sub {
display: inline-block;
font-size: 0.7em;
padding-right: calc(2px + 0.02em);
outline-color: transparent;
outline-style: solid;
text-indent: 0;
vertical-align: -0.8em;
}

/* potenssi */
.sup {
display: inline-block;
font-size: 0.7em;
outline-color: transparent;
padding-right: calc(2px + 0.02em);
outline-style: solid;
text-indent: 0;
vertical-align: 0.3em;
}

/* lavennus */
.lav {
display: inline-block;
font-size: 0.7em;
outline-color: transparent;
outline-style: solid;
text-indent: 0;
vertical-align: 0.6em;
}


/* supistus */
.spi {
display: inline-block;
font-size: 0.7em;
margin-left: 0.2em;
margin-right: 0.1em;
outline-color: transparent;
outline-style: solid;
text-indent: 0;
vertical-align: 0.3em;
}

.int {
vertical-align: -0.1em;
}

/*ala ja ylaindeksi*/
.ala {
background-color: transparent;
display: inline-block;
font-size: 0.7em;
margin-left: 0;
margin-right: 0;
vertical-align: -0.8em;
}

.yla {
background-color: transparent;
display: inline-block;
font-size: 0.7em;
margin-left: 0;
margin-right: 0.1em;
vertical-align: 0.3em;
}

/*yhtalöparit*/
.yhtpari {
display: inline-block;
margin-left: 0.1em;
margin-right: 0.1em;
outline-color: transparent;
outline-style: solid;
padding-left: 0.06em;
padding-right: 0.06em;
position: relative;
text-align: left;
text-indent: 0;
vertical-align: 0;
}

.yparialin {
background-color: transparent;
display: inline-block;
font-size: inherit;
margin-left: 0.4em;
margin-right: 0.2em;
position: relative;
top: 0;
}

.ypariekarivi, .yparivalirivi, .yparivikarivi {
background-color: transparent;
display: block;
}


/*alakeraaja*/
.alasulku {
align-items: center;
display: inline-flex;
flex-direction: column;
justify-content: flex-start;
outline-color: transparent;
outline-style: solid;
padding-left: 0.07em;
padding-right: 0.07em;
position: relative;
text-indent: 0;
vertical-align: 0;
}

.alaeka {
margin-left: auto;
margin-right: auto;
text-align: center;
}

.vaakasulku {
background-color: transparent;
}

.alateksti {
background-color: transparent;
font-size: 80%;
margin-top: -0.1em;
position: relative;
text-align: center;
}

/*ylakeraaja*/
.ylasulku {
align-items: center;
baseline-source: last;
display: inline-flex;
flex-direction: column-reverse;
justify-content: flex-end;
outline-color: transparent;
outline-style: solid;
padding-left: 0.07em;
padding-right: 0.07em;
position: relative;
text-indent: 0;
}

.ylaeka {
margin-left: auto;
margin-right: auto;
margin-top: 0;
text-align: center;
}


.ylateksti {
background-color: transparent;
font-size: 80%;
margin-bottom: -0.08em;
position: relative;
text-align: center;
}

/*vektori*/
.vector, .vectorback {
background-color: var(--bgrcolor, transparent);
display: inline-flex;
font-style: italic;
letter-spacing: 0.02em;
margin-right: 0.1em;
min-width: 0.4em;
outline-color: transparent;
outline-style: solid;
text-indent: 0;
position: relative;
}

.vectorTop {
background-color: transparent;
left: 0.06em;
position: absolute;
pointer-events: none;
top: 0.04em;
}

.vectorTeksti {
left: 0;
padding-top: 0.2em;
position: relative;
top: 0;
}

/*Ylanuoli tekstilla*/
.arrowover, .arrowleftover {
background-color: var(--bgrcolor, transparent);
display: inline-flex;
flex-direction: column;
margin-left: 0.1em;
margin-right: 0.1em;
min-width: 0.4em;
outline-color: transparent;
outline-style: solid;
text-indent: 0;
vertical-align: 0.1em;
}

.arrowunder, .arrowleftunder {
background-color: var(--bgrcolor, transparent);
display: inline-flex;
flex-direction: column;
margin-left: 0.1em;
margin-right: 0.1em;
min-width: 0.4em;
outline-color: transparent;
outline-style: solid;
text-indent: 0;
vertical-align: text-bottom;
}

.arrowTop {
background-color: transparent;
display: block;
}

.arrowTeksti {
background-color: transparent;
display: block;
font-size: 0.8em;
}

.arrowUnder {
background-color: transparent;
display: block;
margin-bottom: 0.3em;
}

.keraaja {
background-color: transparent;
display: inline-block;
}

.ylaosa {
background-color: transparent;
display: table;
font-size: 0.8em;
margin-bottom: -0.1em;
margin-left: auto;
margin-right: auto;
text-align: center;
width: 0.5em;
}

.alaosa {
background-color: transparent;
display: table;
font-size: 0.8em;
margin-left: auto;
margin-right: auto;
margin-top: -0.05em;
text-align: center;
width: 0.5em;
}

.keskiosa {
background-color: transparent;
display: inline-table;
font-size: 1em;
margin: 0 auto;
text-align: center;
width: 0.5em;
}

/*teksti alla ylla*/
.uno {
background-color: var(--bgrcolor, transparent);
border-collapse: collapse;
display: inline-block;
font-size: 1em;
margin-left: 0.1em;
margin-right: 0.1em;
outline-color: transparent;
outline-style: solid;
text-align: center;
text-indent: 0;
vertical-align: 0;
}

/*und = tekstia alla*/
.und {
baseline-source: first;
display: inline-flex;
flex-direction: column;
margin: 0 0.04em 0 0.04em;
outline-color: transparent;
outline-style: solid;
text-indent: 0;
}

.und {
background-color: var(--bgrcolor, transparent);
}


/*tekstia ylla*/
.ove {
background-color: var(--bgrcolor, transparent);
baseline-source: last;
display: inline-flex;
flex-direction: column-reverse;
margin: 0 0.04em 0 0.04em;
outline-color: transparent;
outline-style: solid;
text-indent: 0;
}

.oveeka, .undeka {
text-align: center;
}

.undtoka {
font-size: 80%;
margin: -0.1em 0 0 0;
text-align: center;
white-space: pre;
}

.ovetoka {
font-size: 80%;
margin: 0 0 -0.1em 0;
text-align: center;
white-space: pre;
}

/*neliojuuri*/
.sqr {
border-spacing: 0;
direction: ltr;
display: inline-table;
margin: 0.1em 0.1em 0 0.2em;
outline-color: transparent;
outline-style: solid;
padding-right: 0.06em;
position: relative;
text-indent: 0;
top: 0;
}

.sqrsis {
background-color: transparent;
border-top-color: var(--sqrcolor, black);
border-top-style: solid;
border-top-width: 0.08em;
display: inline-block;
margin-left: 0;
padding-left: 0.1em;
padding-right: 0.1em;
padding-top: 2px;
vertical-align: baseline;
}

.juurimerkki {
background-color: transparent;
display: inline-block;
}

.juurimerkkieka {
background-color: transparent;
border-top-color: var(--juurirtcolor, black);
border-top-style: solid;
border-top-width: 0.05em;
border-right-color: var(--juurirtcolor, black);
border-right-style: solid;
border-right-width: 0.1em;
bottom: calc(10% + 0.04em);
display: inline-block;
height: 0.4em;
position: absolute;
left: 0;
transform: rotate(-30deg);
transform-origin: bottom right;
width: 0.1em;
}

.juurimerkkitoka {
background-color: transparent;
border-left-color: var(--juuricolor, black);
border-left-style: solid;
border-left-width: 0.08em;
display: inline-block;
height: 90%;
left: 0.115em;
position: absolute;
top: 0;
transform-origin: bottom left;
-ms-transform: skew(-20deg, 0deg);
-webkit-transform: skew(-20deg, 0deg);
transform: skew(-20deg, 0deg);
width: 1px;
}


/*njuuri*/
.roo {
border-spacing: 0;
direction: ltr;
display: inline-table;
margin: 0.1em 0.08em 0 0.05em;
padding-right: 0.1em;
position: relative;
outline-color: transparent;
outline-style: solid;
text-indent: 0;
top: 0;
}

.rooapu {
background-color: transparent;
bottom: 0.8em;
display: inline-flex;
font-size: 0.7em;
left: 0;
line-height: 1em;
margin-top: 0.3em;
position: relative;
text-align: right;
vertical-align: bottom;
}

.juuri {
display: inline-block;
padding-left: 0.1em;
padding-right: 0.1em;
}

.rootmerkkieka {
background-color: transparent;
border-top-color: var(--rootrtcolor, black);
border-top-style: solid;
border-top-width: 0.05em;
border-right-color: var(--rootrtcolor, black);
border-right-style: solid;
border-right-width: 0.1em;
bottom: calc(10% + 0.05em);
display: inline-block;
height: 0.4em;
position: absolute;
left: 0;
transform: rotate(-30deg);
transform-origin: bottom right;
width: 0.1em;
}

.roottipaikka {
background-color: transparent;
display: inline-table;
position:relative;
}

.rootapu {
background-color: transparent;
border-top-color: var(--rootopcolor, black);
border-top-style: solid;
border-top-width: 0.08em;
display: inline-block;
margin-left: 0;
padding-bottom: 1px;
padding-right: 0.2em;
padding-left: 0.1em;
padding-top: 2px;
vertical-align: baseline;
}

.rootmerkkitoka {
background-color: transparent;
border-left-color: var(--rootcolor, black);
border-left-style: solid;
border-left-width: 0.08em;
display: inline-block;
height: 90%;
left: 0.115em;
position: absolute;
top: 0;
transform-origin: bottom left;
-ms-transform: skew(-20deg, 0deg);
-webkit-transform: skew(-20deg, 0deg);
transform: skew(-20deg, 0deg);
width: 1px;
}


/*reunat*/
.reunavasen {
background-color: var(--bgrcolor, transparent);
background-image: none;
border-collapse: separate;
border-left-color: var(--revacolor, black);
border-left-style: solid;
border-left-width: 0.12em;
border-spacing: 0;
caret-color: red;
display: inline-table;
margin-left: 0;
outline-color: transparent;
outline-style: solid;
padding-left: 0;
padding-right: 0;
text-indent: 0;
vertical-align: 0;
}

.reunayla {
--reyvaspituus: 0px;
--reyoikpituus: 0px;
--reyleft: 0px;
--reyright: 0px;
--reylcolor: black;
background-color: var(--bgrcolor, transparent);
background-image: none;
border-collapse: separate;
border-spacing: 0;
border-top-color: var(--reylcolor);
border-top-style: solid;
border-top-width: 0.12em;
caret-color: red;
display: inline-table;
margin-left: 0;
outline-color: transparent;
outline-style: solid;
padding-left: 0;
padding-right: 0;
text-indent: 0;
vertical-align: 0;
}

.reunaoikea {
background-color: var(--bgrcolor, transparent);
background-image: none;
border-collapse: separate;
border-right-color: var(--reoicolor, black);
border-right-style: solid;
border-right-width: 0.12em;
border-spacing: 0;
caret-color: red;
display: inline-table;
margin-left: 0;
outline-color: transparent;
outline-style: solid;
padding-left: 0;
padding-right: 0;
text-indent: 0;
vertical-align: 0;
}

.reunaala {
--reavaspituus: 0px;
--reaoikpituus: 0px;
--realeft: 0px;
--rearight: 0px;
--realcolor: black;
background-color: var(--bgrcolor, transparent);
background-image: none;
border-bottom-color: var(--realcolor);
border-bottom-style: solid;
border-bottom-width: 0.12em;
border-collapse: separate;
border-spacing: 0;
caret-color: red;
display: inline-table;
outline-color: transparent;
outline-style: solid;
text-indent: 0;
vertical-align: 0;
}


/*sulut*/
.pare {
border-collapse: separate;
border-spacing: 0;
display: inline-block;
margin-bottom: 0.05em;
margin-top: 0.05em;
outline-color: transparent;
outline-style: solid;
position: relative;
text-indent: 0;
vertical-align: 0;
}

.avaa1, .avaa2, .avaa3, .avaa4, .avaa5, .avaa7, .avaa8 {
margin-left: 0.15em;
}

.avaa6 {
margin-left: 0.2em;
padding-left: 0.1em;
padding-right: 0.1em
}

.sulje1, .sulje3, .sulje4, .sulje5, .sulje7, .sulje8 {
margin-right: 0.15em;
}

.sulje2 {
margin-right: 0.55em;
}

.sulje6 {
margin-right: 0.15em;
padding-right: 0.1em;
}

.auki1 {
background-color: transparent;
border-style: none;
border-left: 0.085em solid;
border-left-color: var(--paleftcolor, black);
border-top-left-radius: 50%;
border-bottom-left-radius: 50%;
bottom: 0;
display: inline-block;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 0.6em;
}

.auki2, .ypari {
background-color: transparent;
display: inline-block;
left: 0;
pointer-events: none;
position: absolute;
}

.auki2, .ypari {
top: 0;
}


.auki3, .kiinni3, .auki6, .kiinni6, .auki7, .auki8, .kiinni7, .kiinni8 {
background-color: transparent;
display: inline-block;
height: calc(100% - 0.1em);
position: absolute;
top: 0;
}

.auki3 {
border-color: var(--paraukicolor, black);
border-style: solid;
border-width: 0.075em 0 0.075em 0.085em;
left: 0;
width: 0.2em;
}

.auki7 {
border-color: var(--lfloorcolor, black);
border-style: solid;
border-width: 0 0 0.075em 0.085em;
left: 0;
width: 0.2em;
}

.auki8 {
border-color: var(--lceilingcolor, black);
border-style: solid;
border-width: 0.075em 0 0 0.085em;
left: 0;
width: 0.2em;
}

.auki4, .kiinni4, .auki5, .kiinni5 {
background-color: transparent;
bottom: 0;
display: inline-block;
height: 100%;
position: absolute;
top: 0;
}

.auki4 {
border-left: 0.085em solid;
border-left-color: var(--pyleftcolor, black);
left: 0;
margin-left: 0;
margin-right: 0;
width: 1px;
}

.auki5 {
border-color: var(--tuaukicolor, black);
border-style: solid double;
border-width: 0 0 0 0.23em;
left: 0;
margin-left: 0;
margin-right: 0;
width: 1px;
}

.auki6 {
border-color: var(--kiinnikiinnicolor, black);
border-style: solid;
border-width: 0.075em 0.085em 0.075em 0;
left: 0;
width: 0.2em;
}

.paresis {
background-color: transparent;
display: inline-table;
position: relative;
vertical-align: 0;
z-index: +1;
}


/* normisulut haka tuplat*/
.paresisleft1 {
margin-left: 0.16em;
padding-left: 0.1em;
}

/* aalto*/
.paresisleft2 {
font-size: 1em;
margin-left: 0.4em;
}

/* pystyt*/
.paresisleft3 {
margin-left: 0.15em;
margin-right: 0.18em;
}

/* hakavaarinpain*/
.paresisleft4 {
margin-left: 0.3em;
padding-left: 0;
}

/* normisulut haka tuplat*/
.paresisright1 {
margin-right: 0.2em;
padding-right: 0.1em;
}

/* aalto */
.paresisright2 {
font-size: 1em;
}


/* pystyt*/
.paresisright3 {
font-size: 1em; 
}

/*hakavaarinpain*/
.paresisright4 {
margin-right: 0.3em;
}

.kiinni1 {
background-color: transparent;
border-style: none;
border-right: 0.085em solid;
border-right-color: var(--parightcolor, black);
border-top-right-radius: 50%;
border-bottom-right-radius: 50%;
bottom: 0;
display: inline-block;
height: 100%;
position: absolute;
right: 0;
top: 0;
width: 0.6em;
}

.kiinni2 {
background-color: transparent;
display: inline-block;
pointer-events: none;
position: absolute;
right: -0.4em;
top: 0;
}


.kiinni3 {
border-color: var(--parkiinnicolor, black);
border-style: solid;
border-width: 0.075em 0.085em 0.075em 0;
right: 0;
width: 0.2em;
}


.kiinni4 {
border-right: 0.085em solid;
border-right-color: var(--pyrightcolor, black);
margin-left: 0;
margin-right: 0;
right: 0;
width: 1px;
}

.kiinni5 {
border-color: var(--tukiinnicolor, black);
border-style: solid double;
border-width: 0 0.23em 0 0;
margin-left: 0;
margin-right: 0;
right: 0;
width: 1px;
}

.kiinni6 {
border-color: var(--aukiaukicolor, black);
border-style: solid;
border-width: 0.075em 0 0.075em 0.085em;
right: 0;
width: 0.2em;
}

.kiinni7 {
border-color: var(--rfloorcolor, black);
border-style: solid;
border-width: 0 0.085em 0.075em 0;
right: 0;
width: 0.2em;
}

.kiinni8 {
border-color: var(--rceilingcolor, black);
border-style: solid;
border-width: 0.075em 0.085em 0 0;
right: 0;
width: 0.2em;
}

.eikiinnitetty {
border-right-color: var(--rightcolor, lightgray);
}

/*binomi*/
.binomi {
background-color: transparent;
border-collapse: separate;
border-spacing: 0;
display: inline-table;
margin-left: 0.085em;
margin-right: 0.085em;
outline-color: transparent;
outline-style: solid;
position: relative;
text-indent: 0;
vertical-align: 50%;
}

.binoauki {
background-color: transparent;
border-bottom-left-radius: 50%;
border-left: 0.085em solid;
border-left-color: var(--bileftcolor, black);
border-top-left-radius: 50%;
bottom: 4%;
content: '';
display: inline-block;
height: 92%;
left: 0;
margin-left: 0;
margin-right: 0;
position: absolute;
top: 4%;
width: 0.6em;
}

.binokiinni {
background-color: transparent;
border-bottom-right-radius: 50%;
border-right: 0.085em solid;
border-right-color: var(--birightcolor, black);
border-top-right-radius: 50%;
bottom: 4%;
content: '';
display: inline-block;
float: left;
height: 92%;
margin-left: 0;
margin-right: 0;
position: absolute;
right: 0;
top: 4%;
width: 0.6em;
}

.binsiseka {
background-color: transparent;	
display: block;
margin-left: 0.1em;
margin-right: 0.1em;
padding-left: 0.2em;
padding-right: 0.2em;
position: relative;
text-align: center;
z-index: +1;
}

.binsistoka {
background-color: transparent;
display: block;
margin-left: 0.1em;
margin-right: 0.1em;
padding-left: 0.2em;
padding-right: 0.2em;
position: relative;
text-align: center;
z-index: +1;
}

.hakaeikiinnitetty {
border-color: var(--parkiinnicolor, lightgray);
}

.valittu {
background-color: rgba(0,0,255,0.99);
outline-color: rgba(0,0,255,0.99);
color: white;
}


/*html editorin otsikot*/
.h1 {
font-size: 2em;
font-weight: bold;
margin-top: 0.5em;
margin-bottom: 0.5em;
margin-left: 0;
margin-right: 0;
text-indent: 0;
}

.h2 {
font-size: 1.5em;
font-weight: bold;
margin-top: 0.8em;
margin-bottom: 0.8em;
margin-left: 0;
margin-right: 0;
text-indent: 0;
}

.h3 {
font-size: 1.17em;
font-weight: bold;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
text-indent: 0;
}

.h4 {
font-size: 1em;
font-weight: bold;
margin-top: 1.2em;
margin-bottom: 1.2em;
margin-left: 0;
margin-right: 0;
text-indent: 0;
}

.h5 {
font-size: .83em;
font-weight: bold;
margin-top: 1.5em;
margin-bottom: 1.5em;
margin-left: 0;
margin-right: 0;
text-indent: 0;
}

.h6 {
font-size: .67em;
font-weight: bold;
margin-top: 2em;
margin-bottom: 2em;
margin-left: 0;
margin-right: 0;
text-indent: 0;
}