/** START spreadsheet ***************************************************************/

#divSpreadsheet{
    overflow-y: auto;
    overflow-x: hidden;
}

/* deze regel voorkomt de lijn om de div heen wanneer hij focus heeft */
#dialogSpreadsheet{
    outline: 0;
    outline: none !important;
}

/* IC301 */
div#SpreadsheetDiv input {
    border: none;
    width: 100%;
    font-size: 14px;
    padding: 2px;
    text-align: right;
    cursor: default !important;
}

/* IC317 */
#spreadsheet input{
    outline: 0;
    outline: none !important;
}


.spreadsheet{
    //background-color: var(--oranjeLicht);
    padding: 5px;
}

div#SpreadsheetDiv td{
    border: 2px #CCC solid;
    padding: 2px;
    background-color: #FFF;
}


.ssHeader{
    text-align: center;
    font-weight: 800;
    padding:2px;
    border: 2px #CCC solid;
    // background-color: var(--menuAchtergrond); // #B1BFD7;
    // //20200917 omgezet naar een lichte variant op de menu-achtergrond; vind ik netter?
    // //#cbe1e4; //#bad8db;
    // color: white;

    // background-color: var(--oranjeHeelLicht);
    // color: var(--oranjeDonker)

    background-color: var(--oranjeHeelLicht);
    color: var(--menuAchtergrond);
}

#formulebar{
    width: 99%;
    margin: 5px 0px 10px 0px;
    border: 2px solid var(--menuAchtergrond);
    outline-style: none;
}

#formulebar:focus{
  border: 2px solid var(--oranjeDonker);
}

#spdButtonBar{
    display: inline-block;
    width: 100%;
    //border: 4px solid var(--blauwMiddel);
}

.spdButton{
    height: 30px;
    width: 30px;
    margin: 3px;
    background-color: var(--oranjeDonker);
    float: left;

    color: white;
    display: flex;
    align-items: center; /* align vertical */
    justify-content: center;
    font-size: 20px;
    cursor: pointer;
}

.spdButton:hover{
    background-color: var(--menuAchtergrond);
}

#spdItalic{
    font-style: italic;
    font-family: "Times New Roman", Times, serif;
    font-size: 30px;
}

#spdBold{
    font-weight: 800;
    font-size: 30px;
}

#spdCopy{
    font-size: 26px;
    padding-bottom: 4px;
}

#spdPaste{
    font-size: 26px;
    padding-bottom: 4px;
}


div#SpreadsheetDiv td.lineright{
    border-right: 2px #666666 solid;
}

div#SpreadsheetDiv td.lineleft{
    border-left: 2px #666666 solid;
}

div#SpreadsheetDiv td.linetop{
    border-top: 2px #666666 solid;
}

div#SpreadsheetDiv td.linebottom{
    border-bottom: 2px #666666 solid;
}

div#SpreadsheetDiv td.tdSelected{
    -webkit-box-shadow: inset 0px 0px 0px 2px var(--oranjeDonker);
    -moz-box-shadow: inset 0px 0px 0px 2px var(--oranjeDonker);
    box-shadow: inset 0px 0px 0px 2px var(--oranjeDonker);
}

div#SpreadsheetDiv input.answerCell{
    background-color: var(--deminLicht) !important;  //20200228 aangepast om uit variables te halen
}

div#SpreadsheetDiv input.alleenlezen{
    background-color: #EEE !important;
}

div#SpreadsheetDiv td.alleenlezen{
    background-color: #EEE !important;
}

// .UIDspreadsheet{
//     background-color: var(--oranjeLicht);
// }
//
//

.ui-dialog.UIDspreadsheet .ui-widget-header {
    background: var(--oranjeLicht);
    border: 0;
    color: var(--menuAchtergrond);
    font-weight: 800;
}

/** EINDE spreadsheet ***************************************************************/