i {
    font-style: normal;
    color:#993300;
}


#midten {
    width: 100%;
    outline-style : none; /*til contenteditable*/
}

/* Clear floats after the columns */
#midten:after {
    content: "";
    display: table;
    clear: both;
}
#version {
    font-size:small;
    position: fixed;
    top:10px;
    right: 10px;
}
#kommandoer {
    top: 0;
    padding: 5px;
    padding-left: 0;
}
#kommandoer:after {
    content: "";
    display: table;
    clear: both;
}
#txtformat {
    float: right;
}
#topbeskedtxt{
    font-size:small;
    overflow: hidden;
    width: 180px;
    white-space: nowrap;
    display: inline-block;
    color: azure;
}
#col0,#col1, #col2 {
    float: left;
    width: 61%;
    overflow: auto;
    max-height: 90vh;
}
#col2 {
    width: 38%;
}
#col0.redpen {
    width: 12%;
}
#col1.redpen {
    width: 50%;
}


#tekstramme {
}

#kommcol {
    overflow-y: auto;
    overflow-x: hidden;
}
#kommcol:empty:before, [contenteditable=true]:empty:before{
    content: attr(placeholder);
    opacity: 0.8;
}
#tekst {
    background-color: var(--bg-tekst);
    color: var(--color-tekst);
    position:relative;
    margin: 5px;
    white-space: normal;
    padding: 2px;
    min-height: 40vh;
    line-height: 140%;
}

.edit {
    position:relative;
    white-space: normal;
    line-height: 140%;
}
.edit>div {
    margin: 20px 0px;
}

.manukomm, #kommcol .manukomm,#tekst .manukomm, .KKteacher1 {
    background-color:var(--bg-manukomm) !important;
}

#vejledning {
    padding: 15px;
    padding-left: 10%;
    padding-right: 10%;
}

.ramme, #intro {
    border: 3px solid var(--border1);
    margin:5px;
    padding: 5px;
}
#bunden {
    position: fixed;
    background-color: var(--bg5);
    bottom: 0;
    right: 0;
    left: 0;
}

#vejledning, #vejledning a, #bunden a, header, #intro {
    color: var(--color3);
}
#intro {
    margin: 40px;
}

.overskrift {
    font-size: x-large;
    margin-bottom: 30px;
}
.right {
    float: right;
}

.skjulbesked, #intro:empty {
    display: none;
}

.citatspan, .citatspan span  {
    background-color: var(--bg-citat);
}
.afsnit {
    margin: 20px 0px;
}
.afsnitstxt {
    padding: 2px 0px;
    line-height: 150%;
    vertical-align:middle;
}
.gram {
    display: none !important;
}
.visgram {
    font-size: smaller;
    white-space: normal;
    background-color: graytext;
}
#grammatik {
    font-size: smaller;
    background-color: #A2BFF4;
    border: 4px ridge darkblue;
    line-height: 170%;
}
#grammatik .par {
    margin: 6px;
    background-color: #A4DFFF;
    padding: 2px;
}
#grammatik .antal {
    padding-left: 4px;
}
.markVerbum {
    text-decoration: wavy red solid;
}
.markSubstantiv {
    text-decoration: underline blue solid;
}
.markAdjektiv {
    text-decoration: underline blueviolet solid;
}
.markAdverbium {
    text-decoration: underline green solid;
}
.markPronomen {
    text-decoration: underline darkblue solid;
}
.markKonjunktion {
    text-decoration: underline darkorange solid;
}

#retalt {
    position:fixed;
    z-index: 1;
    top: 200px;
    left: 200px;
    background: var(--bg4);
}

.kravUdtryk {
    text-decoration: underline;
    text-decoration-style: dotted;
    text-decoration-color: green;
}
.kravVerbum {
    text-decoration: underline;
    text-decoration-style: dotted;
    text-decoration-color: blue;
    text-decoration-style: 
}

#message {
    position:fixed;
    z-index: 1;
    pointer-events: none;
    opacity: 0;
    top: 0;
    left: 200px;
    background: var(--bg4);
}

.opsumfelt {
    height: 1.5em;
}

.opsumfelt {
    min-height: 1.5em;
    display:inline-block;
    min-width: 30px;
    background-color: white;
}
.opsumfelt::before {
    content: "\200B";
}
.respons #opgtypeel:has(#opgtype:empty) {
  display: none;
}


.KKfri:empty::before {
    content: "Skriv en besked med formatet <genvej>: <besked> - <lang forklaring>";
}
.KKfri {
    outline: 0;
}

#opsummering {
    border: groove 1px var(--border-opsummering);
    margin: 5px;
    padding: 5px;
    background-color: var(--bg-fuldbesked);
    color: var(--color-tekst);
}


#opsummering div {
    margin-bottom: 10px;
}

#opsumkommentar {
    border: solid 1px black
}



#licensbesked {
    text-align:center;
    background-color: var(--bg4);
    padding: 5px;
    width: 92%;
    margin-top: 5px;
}


.xtraInfo {
    margin-top: 3px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

#rapport {
    white-space: normal;
}

#kommcol .gem, #kommcol .gempar, #kommcol .gemcitat, .tip .gem {
    display: none;
}

.KKfejl:not(.gemcitat):not(.gem):not(.gempar):not(.besked){
    background-color:var(--bg-fejl);
}
.KKmuligfejl:not(.gemcitat):not(.gem):not(.gempar):not(.besked){
    background-color:var(--bg-muligfejl);
}
.KKkommentar:not(.gemcitat):not(.gem):not(.gempar):not(.besked){
    background-color:var(--bg-kommentar);
}


#vejledning .KKfejl, #vejledning .KKmuligfejl, #vejledning .KKkommentar {
    color: var(--color-tekst);
}


.licensKnap {
    width: 46%;
    padding:11px 2px;
}
.zoomKnap {
    width: 2em;
}
.erstatKnap, .lilleKnap {
    width: auto;
    margin-left: 4px;
}

table,th,td
{
    border:1px solid #004ab2;
}

#dialog {
    position:absolute;
    display: none;
    left: 0px;
    top: 0px;
    width:100%;
    height:100%;
    z-index: 9999999;
}
#dialogbox {
    background-color: var(--bg-dialog);
    max-width:50%;
    height: 80%;
    overflow: auto;
    margin: 100px auto;
    border:5px solid #000;
    padding:15px;
}

#responsdialog {
}

#oversigt {
    background-color: var(--bg-tekst);
    width: 100%;
    height: 100%;
    overflow: auto;
}

.tid {
    font-size: 1em;
}


#tips {
    position: absolute;
    height:fit-content;
    max-width: 260px;
    text-align: left;
    background-color: #FFF;
    color: #111;
    border: solid #555 2px;
    top: 0px;
    left:0px;
    z-index: 99999;
    transition: opacity 1s;    
}

#tips > div, #kommcol > div > div{
    padding: 2px 3px;
    border: 1px solid #555;
}

#kommcol > div > div > div {
    padding: 2px;
    border-bottom: 1px solid #555;
}
#tips > div:last-child, #kommcol > div> div > div:last-child {
    border-bottom: 0px solid #555;
}

#tips .xtra {
    padding: 2px;
    border: 1px solid #555;
}

#tips.pilitop::after {
    top: -17px;
}

.tiplex {
    display: none;
}



.indz, .Tafsn {
    background-color:var(--bg-indz);
}

.Tafsn.tip  {
    background-color:var(--bg-indzmark);
}


.KKfri {
    background-color:var(--bg-manukomm);
}


#kommcol .knap {
    display: none;
}

#kommcol .ses .knap {
    display: initial;
}

.edit .knap {
    border: initial;
}

button.KKfri {
    width: 95%;
    overflow-x: hidden;
    text-overflow: clip;
    text-wrap:nowrap;
    text-align: left;
}

.tip {
    display:inline-block;
    border: solid 2px;
    border-radius: 4px;
    cursor: pointer;
}

.gemcitat, .gem, .gempar  {
    border: initial;
    cursor: initial;
}

.ses {
    border: black solid 3px !important;
    z-index: 1;
}

.edit .uset, #kommcol .uset { 
    border: deeppink solid 2px;
    border-color: deeppink;
    cursor: pointer;
}

.edit .ses, #kommcol .ses {
    border: black solid 2px;
    padding: 0;
    z-index: 1;
}

#tips button.lang, #kommcol .ses .lang{
    display: block;
}