/*---------------------------------------------------!KBNew -----*/

.MainKBCont_Holder{
    display:inline-block;
    text-align: center;
}

.MainKB_Cont{ position:relative; display:inline-block;block;/* text-align: center; */}

.MainKB_Tab{
    
    display:inline-block;
    position: relative;
    top: 1em;
    background-color: transparent;
    border-radius: 0.6em 0.6em 0em 0em;
    border: 0.1em solid black;
    border-bottom: 0;
    margin: 0 0.5em 0 0;
    color:lightgray;
     cursor: pointer;

     &:first-of-type{
        
        margin-left: 1.3em;
        
    }

    &.Active{

        background-color: #d9d9d9;
        z-index:500;
        
    }
     
}

.KB_Panel{
    display: inline-block;
    position: relative;
    border: 0.1em solid black;
    border-radius: 0.2em;
    background-color: #f3e8ff;
    padding: 0.4em 0.3em 0.7em 0.3em;
    margin: 1em 0.5em 0 0.5em;
    text-align: left;
    /* max-width:80%; */
}

.KB_DictationTrans{
    
    font-size: 1.6em;
    margin-top:2em;
    
}

.KB_Letters_Row{

    display: table;
        white-space: nowrap;
       
    
}

.KB_Letters {
    
    font-size: 1.3em;
    
    .KBShiftBox {
        font-family: "IE";
    }

    .KBBox {
        height: 2.8em;
        min-width: 2em;
        font-family: "IE";
        padding-top: 0.2em;
         padding-bottom: 0.2em;
        
        & .LetterKBBox_NormalBrackets {
            font-family:"IE_Norm";
        }

        &.KBSpaceKey{ min-width:4em}
        
    }
}

.KB_Soundicons{
     .KBBox { font-size:2.4em; }
}

.KB_Spells{
    .KBBox { font-size:1.4em; margin: 0.4em; }
}


.KB_Grammicons{
    font-size: 1.4em;
    
     .KBBox {
         display: inline-block;
         position: relative;
         font-size: 1.5em;
         width: 1.3em;
         height: 1.6em;
         text-align: center;
         padding: 0.1em;
         background-color: white;
         border-width: .09em;
         color:black;
     }
     .GrammiconKB_Grammicon {
            position: relative;
            top: -0.4em;
            display: inline-block;
            font-family: "Grammicons";
            font-size: 0.6em;
            text-align: center;
            
             &.BigGrammiconKBKey{ top:-0.1em; font-size: 100%;  }
         
       }

        .GrammiconKB_GrammisignPic
        {
            position: relative;
            top: -0.4em;
            display: table-cell;
            left: 0.1em;
            height: 0.7em;
            width: 0.7em;
            background-repeat:no-repeat;
            background-size: contain;
            
            &.BigGrammisignKBKey{
                top: 0.15em;
                width:1em;
                height:.8em;
                left: 0em;
            }
        }
    }
    
}

.KB_Spells{ background-color:red; font-size: 3em; }
    
.KB_Spellicons{

    font-size: 2.4em;

    .KBBox{ min-width: 1.5em; height:1.3em; padding-top: 0.1em; }
    
     .SpelliconsKB_SpelliconBox { font-family: "Spells"; }

    .SpelliconsKB_SoundiconBox{ font-family: "Soundicons"; border-color: blue; font-weight: 1000; }
    
}


/*---------------------------------------------------!KB -----*/
.KBHolder {
    position: relative;
    display: inline-block;
    border: 0.04em solid gray;
    border-radius: 0.2em;
    background-color: #fdfcfc;
    font-size:4em;
    margin: 1em 0em 0em 0.9em;
    padding: 0.2em;
    z-index: 10;
}

.KB_TitleCont {
    position: absolute;
    top: -.7em;
    left: .2em;
    border: 2pt solid gray;
    border-radius: .4em;
    background-color: white;
    padding: .1em;
}

.KB_TitleText { font-size: .7em; }

.KBBox {
    display: inline-block;
    margin: .05em;
    border: 0.03em solid gray;
    border-radius: 10%;
    font-size: 1em;
    vertical-align: middle;
    padding: 0 .1em .05em .1em;
    text-align: center;
    color: black;
    background-color: #e0dfdf;
    cursor: pointer;
}

.SoundiconKBHolder { font-size: .9em;}

.AllIconsKBHolder { display: inline-block; width: 90vw; }

.EngWordsKBHolder {
    font-size: .9em;
    
    & .KBBox { height: 2.4em; min-width: 2em; }
}

.LetterKBHolder {
    font-size: 1.8em;
    
    .KBShiftBox {
        position: relative;
        display: inline-block;
        margin: .05em;
        border: 0.05em solid gray;
        border-radius: .2em;
        font-size: 1em;
        vertical-align: middle;
        padding: 0 .1em .05em .1em;
        text-align: center;
        color: black;
        background-color: white;
        height: 4.4em;
        min-width: 3.6em;
        font-family: "IE";
    }

    .KBBox {
        height: 2.4em;
        min-width: 2em;
        font-family: "IE";
        
        & .LetterKBBox_NormalBrackets { font-family:"IE_Norm";}
    }
}

.LetterKBHolder.UsingRealKB {
    padding: 0.0em ;
    
    & .KB_TitleCont { visibility: hidden; border: none; }

    & .KBBox { font-size: .00001em; border: none; }
}

.LetterKBBoxGroupMarker { background-color: #f8fdf3 !important; }

.LetterKBBox_WideDescn { min-width: 4em!important; }

.KB_Letters_Char {
    font-size: 1.5em;
    position: relative;
    top: 0.05em;
    min-width: .7em;
    font-size: 2.2em;
}

.LetterKB_SmallChar {
    position: absolute;
    top: .1em;
    left: .0em;
    font-size: 1.5em;
}

.LetterKB_DescnEng {
    position: relative;
    display: table;
    margin: 1.2em .3em 0 .5em;
    display: inline-block;
    font-family:"IE_Norm";
    font-weight: 1000;
    font-size: 1em;
}



.MusicKBHolder .KBBox {
    min-width: 50;
    height: 70;
    line-height: 70;
    font-size: 50;
}

.SoundiconKBBox {
    font-family: "Soundicons";
    position: relative;
    font-size: 1.8em;
    min-width: 1.4em;
    height: 1.6em;
    bottom: -.07em;
    right: -.07em;
    text-align: center;
    background-color: snow;
    padding: .15em 0 0 0 ;
    margin: .1em;
    -webkit-text-stroke-width: 0.025em;
}

.SoundiconKB_MagiconBox {
    width: 1.1em;
    height: 1.1em;
    border-radius: .1em;
    padding: 0em 0 .1em 0em;
    font-size: 2.4em;
}

.SoundiconKB_MagiconBox_Char {
    position: relative;
    top: -0.1em;
    font-family: "Soundicons";
}

.SoundiconKB_MagiconBox_Help {
    position: relative;
    top: -1.55em;
    font-size: .17em;
    color: black;
    z-index: 10000;
    font-family: "IE";
    text-align: center;
}

.GrammiconKBHolder {
    font-size: 1.3em;
    
    .KB_HelpOpenerBtn { top: 0.1em; left: 0.5em; }

    .KBBox {
        display: inline-block;
        position: relative;
        font-size: 2em;
        width: 1.3em;
        height: 1.7em;
        text-align: center;
        padding: 0.1em;
        border-width: .09em;
        &.Disabled_Less {
            opacity: 1;
            border-style: dashed;
            box-shadow: unset;
            border-width: .04em;
        }

        .GrammiconKB_Grammicon {
            position: relative;
            display: inline-block;
            width: 100%;
            font-family: "Grammicons";
            font-size: .5em;
            text-align: center;
        }

        .GrammiconKB_Grammisign {
            position: relative;
            display: inline-block;
            height: 1em;
            font-family: "Grammisigns";
            font-size: .7em;
            text-align: center;
        }

        .GrammiconKB_GrammisignPic {
            position: relative;
            top: 0.1em;
            display: inline-block;
            height: .7em;
        }
    }
}

.GrammiconKB_Descn {
    display: inline-block;
    position: relative;
    top: .2em;
    font-family:"IE_Norm";
    color: black;
    text-align: center;
    line-height: .9em;
    font-size: .15em;
    font-weight: 1000;
}

.GrammiconKB_Descn_Big {
    top: .6em;
    font-size: .25em;
    line-height: 1.2em;
}

.GrammiconKB_Descn em {color: blue; }

.GrammiconKB_Descn i {  color: magenta; }

.GrammiconKB_Descn b {  color: green; }

.GrammiconKB_Descn strong {  color: red; }

.SpellsKB_KBBox {
    position: relative;
    display: inline-block;
    height: 2.7em;
    width: 3.5em;
    padding-top: 0.7em;
    &.CanPlaySound:
    after {
        font-size: 21em;
    }
}

.SpellsKB_Letter {
    position: relative;
    font-family: "Spells";
    top: .07em;
    line-height: 1.1em;
    font-size: 2.5em;
    margin: 0.05em 0 0 0.1em;
}

.SpellsKB_LetterNum {
    position: absolute;
    top: -0.1em;
    left: -0.15em;
    font-size: 0.7em;
    width: 1em;
    border: 0.15em dotted transparent;
    background-color: white;
    border-radius: 50%;
    text-align: center;
}

.SpellsKB_ExampleWord {
    position: relative;
    line-height: 0.4em;
    top: -.3em;
    font-size: .6em;
}

.KB_HelpCont {
    position: relative;
    vertical-align: middle;
    padding: .2em;
    margin: .2em .5em 0 0;
}

.KB_HelpOpenerBtn {
    position: relative;
    top: 0;
    left: 0;
    margin: 0 0.5em 0 0;
    background-color: var(--Colr_Info);
}

.KB_HelpCont_ArrayTransTitle {
    position: relative;
    top: -0.4em;
    display: inline-block;
    margin: 0 0.6em 0 0;
    font-weight: 1000;
}

.MusiconKBHolder .KBBox {
    display: inline-block;
    height: 3.2em;
    padding: 0.38em;
    font-size: 3.7em;
    font-family:"IE_Norm";
}