td.a{
    border: 2px solid white;
    background-color: #8434bd;
    color: white;
    width: 100px;
    height: 20px;
    text-align: center;
}
td.be{
    border: 2px solid white;
    background-color: #e9acff;
    width: 75px;
    height: 20px;
    text-align: center;
}
td.bo{
    border: 2px solid white;
    background-color: #cb5cff;
    width: 75px;
    height: 20px;
    text-align: center;
}
table{
    border-collapse: collapse;
}
textarea.input1{
    width:calc(100% - 12px);
    margin: 3px;
    border: 1px solid black;
    border-radius: 3px;
    height: 60px;
    resize: none;
}
button.button1{
    font-size: 14px;
    padding: 4px;
    margin: 1px;
}
div.box{
    position: static;
    background-color: white;
    border:2px solid black;
    margin: 5px;
    padding: 0px;
    width: min(350px, calc(100% - 20px));
    height: 330px;
    display: none;
    overflow-y: hidden;
    transition: height 0.3s;
}
div.list{
    background-color: white;
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: 294px;
    overflow-y: scroll;
}
div.caption{
    top: 0px;
    position: sticky;
    background-color: #ffffff;
    width: 100%;
    margin: 0px;
    padding-top: 6px;
    height: 30px;
    font-size: 18px;
    text-align: center;
}
button.notation{
    background-color: #e0e0e0;
    width: calc(100% - 6px);
    margin: 3px;
    height: 30px;
    transition:background-color 300ms;
    transition:color 300ms;
}
button.notation:hover{
    background-color: #f0f0f0;
}
button.notation2{
    background-color: #707070;
    color: white;
    width: calc(100% - 6px);
    margin: 3px;
    height: 30px;
    transition:background-color 300ms;
    transition:color 300ms;
}
button.notation2:hover{
    background-color: #808080;
}