.buttonDirect {
    background: rgb(255, 182, 193);
}

.buttonIndirect {
    background: rgb(176, 224, 230);
}

.buttonFreeIndirect {
    background: rgb(152, 251, 152);
}

.buttonReported {
    background: rgb(255, 255, 0);
}

.buttonAmbig1 {
    background: rgb(255, 218, 185);
}

.buttonFrame {
    background: rgb(220, 220, 220);
}

.stwrButtonDiv {
    display: grid;
    grid-template-rows: auto auto auto auto;
    grid-template-columns: auto auto auto auto auto;
    grid-template-areas: "c11 . c13 . c15" "c21 c22 c23 c24 c25" "c31 c32 c33 . c35" ". . c43 . .";
    grid-column-gap: 5px;
    grid-row-gap: 5px;

}

.stwrButtonDiv > button {
    font-family: Georgia, Verdana, Calibri, Helvetica, Arial, Sans-serif;
}

.stwrfont{
    font-family: Georgia, Verdana, Calibri, Helvetica, Arial, Sans-serif;
}
.stwrButtonDiv > button:disabled {
    color: darkgrey;
}

.buttonFrame {
    grid-area: c11;
}

.buttonambigdialog{
    margin-left:  10px;
}

.buttonSpeaker {
    grid-area: c13;
}

.buttonIntExp {
    grid-area: c15;
}

.buttonDirect {
    grid-area: c21;
}

.buttonIndirect {
    grid-area: c22;
}

.buttonReported {
    grid-area: c24;
}

.buttonFreeIndirect {
    grid-area: c23;
}

.buttonAmbig1 {
    grid-area: c25;
}

.buttonSpeech {
    grid-area: c31;
}

.buttonThought {
    grid-area: c32;
}

.buttonWriting {
    grid-area: c33;
}

.buttonAmbig2 {
    grid-area: c35;
}

.buttonMetadata {
    margin-top: 20px;
    grid-area: c43;
}

.stwrButtonSecondCol {
    grid-area: secondColArea;
}

.stwrButtonThirdCol {
    grid-area: thirdColArea;
}

.stwrButtonFourthCol {
    grid-area: fourthColArea;
}

.stwrButtonFifthCol {
    grid-area: fifthColArea;
}

.jsgrid-grid-header {
    position: sticky;
    top: 0;
    overflow: hidden;
}

#stwrView {
    height: 100%;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
    grid-template-areas: "buttonsArea" "tableArea";
}

#stwrtable {
    grid-area: stwrtableArea;
    overflow: auto;
}

#frametable {
    grid-area: frameArea;
    overflow: auto
}

.stwrtablearea {
    display: grid;
    grid-area: tableArea;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto;
    grid-template-areas: "stwrtableArea" "frameArea";
    overflow: scroll;
}

.rwTypeAmbigDialog{
    display:none;
    position: fixed;
    top:30%;
    left:50%;
    z-index: 1337;
    border: 2px solid #656565;
    background: ghostwhite;
    padding: 10px;
    border-radius: 10%;
}

.form-group input[type="checkbox"] {
    display: none;
}

.form-group input[type="checkbox"] + .btn-group > label span {
    width: 20px;
}

.form-group input[type="checkbox"] + .btn-group > label span:first-child {
    display: none;
}
.form-group input[type="checkbox"] + .btn-group > label span:last-child {
    display: inline-block;
}

.form-group input[type="checkbox"]:checked + .btn-group > label span:first-child {
    display: inline-block;
}
.form-group input[type="checkbox"]:checked + .btn-group > label span:last-child {
    display: none;
}