/*
@font-face {
    font-family: 'Font C5';
    font-style: normal;
    font-weight: 400;
    /*font-display: auto;/**/
    /*src: url("../Untitled1.ttf") format("truetype");/**/
/*    src: url("../all.woff") format("woff");
    /*  src: url("../webfonts/fa-regular-400.eot");
    /*  src: url("../webfonts/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../webfonts/fa-regular-400.woff2") format("woff2"), url("../webfonts/fa-regular-400.woff") format("woff"), url("../webfonts/fa-regular-400.ttf") format("truetype"), url("../webfonts/fa-regular-400.svg#fontawesome") format("svg"); }
    /**/
/*}/**/

.wnd-container .content {
    overflow: auto;
    height: 100%;
    box-sizing: border-box;
}

#doc-container {
    display: flex;
    flex-direction: row;
    height: 100%;
    background: #FFFFFF;
}

#formulaeditor {
    /*    position: absolute;
        top: 1px;
        left: 100px;
        display: flex;
        flex-direction: column;
        margin: auto;
        /**/
    /*   width: 768px;
       height: 480px;/**/
 /*   border: 1px solid lightgrey;/**/
    /*    background: #97e3ff;/**/
    /*    background: #f7eedb;/**/
    /*    background: #fff6e3;/**/

    /*    background: #fff8eb;/**/
   /* background: #FFFFFF;/**/
    background: #F5F5F5;/**/

}

#formulaeditor.cursor-pointer{
    cursor: pointer;
}

#formulaeditor.cursor-hand{
    cursor: hand;
}

#page-navigator {
    display: inline-flex;
}

#numpage {
    width: 24px;
    height: 50px;
    /*top: 880px;
    left: 90px;/**/
    padding: 0;
    margin: 3px 0px 3px 0px;
    box-sizing: border-box;
    border-color: #D8D8D8;
    border-left: 0;
    border-right: 0;
    text-align: center;
    font-size: 1.2em;
}

#but-left {
    width: 13px;
    height: 50px;
    padding: 0;
    margin: 3px 0px 3px 3px;
    /*top: 880px;
    left: 90px;/**/
}

#but-right {
    width: 13px;
    height: 50px;
    padding: 0;
    margin: 3px 3px 3px 0px;
    /*top: 880px;
    left: 90px;/**/
}

#but-next {
    height: 100px;
}

#mouseX, #mouseY {
    width: 50px;
    height: 20px;
    /*top: 880px;
    left: 90px;/**/
    margin: 0.5em auto 0 auto;
}

.btn-panel-formula {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    width: max-content;
    min-width: max-content;
    height: 100%;
    overflow-y: auto;
    overflow-x: visible;
    /* overflow-x: hidden;/**/
    flex: 0 1 auto;
    align-items: center;
    background-color: #F5F5F5;
}

/*
.btn-panel-formula button{
    width: 50px;
    min-height: 50px;
    margin: 3px;
    margin-bottom: 0;
    flex-basis: auto;
    padding: inherit;
    min-width: min-content;
}

.btn-panel-formula button:last-child{
    margin-bottom: 20px;
}
/**/

.btn-panel-formula > button:last-child {
    margin-bottom: 20px; /**/
}

.canva-panel-formula {
    display: block;
    flex: 1 1 auto;
    bottom: 0;
    right: 0;
    top: 0;
    left: 100px;
    /*    overflow: auto;/**/
    overflow: hidden;
    text-align: left;
}

.btn-panel-formula > button {
    width: 50px;
    min-height: 50px;
    margin: 3px;
    margin-bottom: 0;
    flex-basis: auto;
    padding: inherit;
    min-width: min-content; /**/
}

/**/

.formula-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.formula-menu > ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-width: max-content;
    max-width: 150px;
    height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    flex: 0 1 auto;
}

.formula-menu li {
    margin: 0;
    padding: 0;
}

.formula-menu > ul > li {
    margin: 2px 3px;/**/
    /*margin: 0 auto;/**/
}

.formula-menu li > a {
    margin: 0;
    padding: 0;
    color: rgb(68, 68, 68);
    text-decoration: none;
    user-select: none;
    outline: none;
    /*background: rgb(245, 245, 245) linear-gradient(#f4f4f4, #f1f1f1); /**/
    /*background: rgb(255, 255, 255) linear-gradient(#fdfdfd, #fafafa);/**/
    background-color: #F5F5F5;
    font-family: arial, sans-serif;
    font-size: 16px;
    font-weight: bold;
    /*border: 1px solid rgba(0, 0, 0, .1);/**/
    border: none;
    //border-bottom: 1px solid rgba(0, 0, 0, 0.05);

    transition: all .218s ease 0s;
    cursor: pointer;

    display: inline-flex;
    justify-content: center;
    align-items: center;

    width: 50px;
    height: 50px;
}

.formula-menu li > a:hover {
    color: rgb(24, 24, 24);
    /*border: 1px solid rgb(198, 198, 198);/**/
    /*background: #f7f7f7 linear-gradient(#f7f7f7, #f1f1f1);/**/
    /*background: #f7f7f7 linear-gradient(#fafafa, #f7f7f7);/**/
    background: rgba(128, 128, 128, 0.18);/**/
    /*box-shadow: 0 1px 2px rgba(0, 0, 0, .1);/**/
    /*box-shadow: inset 0px 0px 20px rgba(255, 255, 255, 0.50);/**/
    box-shadow: inset 0px 0px 20px rgba(255, 255, 255, 0.50);
}

.dropdown {
    display: inline-block;
    list-style: none;
    margin: 0;
    padding: 0;
}

.dropbtn {
/*    background-color: #4CAF50;/**/
/*    color: white;/**/
/*    padding: 16px;
    font-size: 16px;
    border: none;/**/
}

.dropdown-content {
    display: none; /**/
    /*display: inline-flex;/**/
    position: absolute;
    /*background-color: #fbfbfb;/**/
    background-color: #F5F5F5;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    justify-content: flex-start;
    flex-wrap: wrap;
    /* justify-content: space-between;/**/
}
.dropdown-content.rows{
    /*display: inline-flex;/**/
    flex-direction: column;
}

.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {
    background-color: #ddd;
}

@keyframes animation-show{
    0%{
        opacity:0;
    }
    100% {
        opacity:1;
    }
}


/* ----------- Non-Retina Screens ----------- */
@media screen
and (min-device-width: 1200px)
and (max-device-width: 1600px)
and (-webkit-min-device-pixel-ratio: 1) {
    .dropdown:hover .dropdown-content {
        display: inline-flex;
    }
    .btn-panel-formula{
        /*background: aqua;/**/
    }
}

/* ----------- Retina Screens ----------- */
@media screen
and (min-device-width: 1200px)
and (max-device-width: 1600px)
and (-webkit-min-device-pixel-ratio: 2)
and (min-resolution: 192dpi) {
    .dropdown:hover .dropdown-content {
        display: inline-flex;
    }
    .btn-panel-formula{
        /*background: aqua;/**/
    }
}
.dropdown:hover .dropdown-content {
/*    display: inline-flex;
/*    opacity:0;
    /*animation: animation-show 0.5s ease infinite;/**/
/*    animation-name: animation-show;
    animation-duration: 0.5s;/**/
/*    animation-iteration-count: 1;/**/
}

/*{*/
/*.dropdown::choiceshover .dropdown-content {
    display: inline-flex;
}
/*}*/
/*@media handheld and (color) {/**/
.dropdown:hover .dropdown-content {
    /*display: none;/**/
}

.dropdown.opened .dropdown-content {
    display: inline-flex;
}

.dropdown.opened .dropbtn {
    background: rgba(128, 128, 128, 0.18);/**/
    box-shadow: inset 0px 0px 20px rgba(255, 255, 255, 0.50);
}

/*}/**/

.dropdown:hover .dropbtn {
/*    background-color: #3e8e41;/**/
}
.inline-flex {
    display: flex;
}

.fc, .fa, .far, .fas{
    /*color: #dddddd;/**/
    /*color: #F0F0F0;/**/
    /*color: #BDC8CA;/**/
    color: lightslategrey; /**/
}

.fa::before {
    /*text-shadow: 1px 1px 1px #00000050, 0px 0px 1px #00000075;/**/
    /*text-shadow: 1px 1px 1px #00000080, 0px 0px 1px #000;/**/
/*    text-shadow: none; /**/
}

.button3 {

}

#but-clear .fa:before {
    color: #FFFFFF;
}

#but-red .fa:before {
    color: #FF0000;
}

#but-green .fa:before {
    color: #00FF00;
}

#but-blue .fa:before {
    color: #0F23A0;
}

#but-white .fa:before {
    color: #FFFFFF;
}

#but-grey .fa:before {
    color: #BBBBBB;
}

#but-black .fa:before {
    color: #000000;
}

#but-red .fc:before {
    color: #FF0000;
}

#but-green .fc:before {
    color: #00FF00;
}

#but-blue .fc:before {
    color: #0F23A0;
}

#but-white .fc:before {
    color: #FFFFFF;
}

#but-grey .fc:before {
    color: #BBBBBB;
}

#but-black .fc:before {
    color: #000000;
}


#but-lining-cell .fc:before, #but-lining-line .fc:before, #but-lining-slashline .fc:before {
    color: #00C8C8;
}

#but-paper-old .fa:before {
    color: #FFF8EB;
}
#but-paper-white .fa:before {
    color: #FFFFFF;
}
#but-paper-brown .fa:before {
    color: brown;
}
#but-paper-black .fa:before {
    color: #000000;
}
/*
#but-screenlens .fa:before {
    color: #CCCCCC;
}
/**/

.but-color-gray .fa:before {
    /*color: #CCCCCC;/**/
    color: lightslategrey;
}

.but-color-turquoise .fa:before {
    color: #00CBDD;
}

.but-color-red .fc:before {
    color: #FF0000;
    /*background: rgba(250, 150, 150, 1);/**/
}

#but-next.but-color-red {
    background: rgba(255, 220, 220, 1);/**/
}

#debug-console {
    display: none;
    position: absolute;
    right: 0px;
    bottom: 0px;
    height: 80%;
    box-sizing: border-box;
    min-height: 5em;
    width: calc(100% - 150px);
    min-width: 70%;
    overflow: auto;
    background: rgba(255, 255, 255, 0.75);
    border: 1px #CCCCCC solid;
    text-align: left;
    padding: 0.5em 1em;
}