/* GRADES */


.stage-grades {
    display: flex;
    flex-direction: column;
    margin:  10px auto;
    border: 1px solid black;
    justify-content: center;
    width: auto;
}

.stage-grades-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
/*    width: max-content;*/
    margin: 20px auto;
}

.stage-grades-wrapper > * {
    margin: 10px auto;
}

.stage-grades > * > * {
    width: 80px;
    text-align: center;
    border: 1px solid black;
    box-sizing: border-box;
    border-collapse: collapse;
    display: flex;
    min-width: 100px;
    max-width: 100px;
    min-height: 50px;
    max-height: 50px;
    overflow: scroll;
    scrollbar-width: none;
}

.stage-grades > * > *::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.stage-grades > * > * > * {
    margin: auto;
}

.stage-grades .edit {
    background-color: #e5f5e5;
}

.stage-grades .show {
    background-color: #aafcb1;
}

.stage-grades .send {
    background-color: #eecece;
}


.stage-grades .none {
    background-color: red;
}

.problem-numbers-container {
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
}

.grades-container {
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
}

.appeals-container {
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
}

.solutions-container {
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
}

.grades-container .content-title {
    margin: auto;
}


@media screen and (max-width: 900px) {
    .stage-grades {
        flex-direction: row;
    }

    .stage-grades > * {
        flex-direction: column;
    }
}