fair-web/static/style.css

.main.container {
    margin-top: 5.5em;
}

.padding {
    padding-left: 1.5em;
    padding-right: 1.5em;
}

.ui.segment:first-child {
    margin-top: 0;
}

.hljs {
    background: #FFF !important;
}

.ui.footer.segment {
    margin: 2em 0em 0em;
    padding: 1em 0em;
    border: none;
}

th {
    white-space: nowrap;
}

pre {
    tab-size: 4;
}

/* status color */

/*
.accordion .status_detail {
    transition: color .1s ease;
}
*/

:not(.status_detail).status.accepted,
.title:hover .status_detail.status.accepted,
.title.active .status_detail.status.accepted,
:not(.status_detail).status.passed,
.title:hover .status_detail.status.passed,
.title.active .status_detail.status.passed {
    color: forestgreen;
}

:not(.status_detail).status.wrong_answer,
.title:hover .status_detail.status.wrong_answer,
.title.active .status_detail.status.wrong_answer {
    color: red;
}

:not(.status_detail).status.runtime_error,
.title:hover .status_detail.status.runtime_error,
.title.active .status_detail.status.runtime_error,
:not(.status_detail).status.file_error,
.title:hover .status_detail.status.file_error,
.title.active .status_detail.status.file_error {
    color: darkorchid;
}

:not(.status_detail).status.memory_limit_exceeded,
.title:hover .status_detail.status.memory_limit_exceeded,
.title.active .status_detail.status.memory_limit_exceeded,
:not(.status_detail).status.time_limit_exceeded,
.title:hover .status_detail.status.time_limit_exceeded,
.title.active .status_detail.status.time_limit_exceeded,
:not(.status_detail).status.output_limit_exceeded,
.title:hover .status_detail.status.output_limit_exceeded,
.title.active .status_detail.status.output_limit_exceeded {
    color: sandybrown;
}

:not(.status_detail).status.waiting,
.title:hover .status_detail.status.waiting,
.title.active .status_detail.status.waiting,
:not(.status_detail).status.system_error {
    color: grey;
}

:not(.status_detail).status.running,
.title:hover .status_detail.status.running,
.title.active .status_detail.status.running {
    color: #6cf;
}

:not(.status_detail).status.partially_correct,
.title:hover .status_detail.status.partially_correct,
.title.active .status_detail.status.partially_correct {
  color: #01bab2;
}

:not(.status_detail).status.judgement_failed,
.title:hover .status_detail.status.judgement_failed,
.title.active .status_detail.status.judgement_failed {
  color: #78909C;
}

:not(.status_detail).status.compiling {
    color: #00b5ad;
}

:not(.status_detail).status.no_testdata {
    color: brown;
}

:not(.status_detail).status.compile_error {
    color: rgb(0, 68, 136);
}

/* score color */
.score_0 {
    color: red;
}

.score_1 {
    color: #ff4b00;
}

.score_2 {
    color: #ff6200;
}

.score_3 {
    color: #ffa900;
}

.score_4 {
    color: #ffd800;
}

.score_5 {
    color: #c8ff00;
}

.score_6 {
    color: #a5ff00;
}

.score_7 {
    color: #52ff00;
}

.score_8 {
    color: #41f741;
}

.score_9 {
    color: #34d034;
}

.score_10 {
    color: forestgreen;
}

.score {
    text-shadow: 0 0 0.1px;
}

/* code tag */
:not(pre) > code {
    background: #E0E1E2;
    padding: 2px;
    border-radius: 2px;
    color: rgba(0, 0, 0, 0.6);
    font-size: 0.85em;
}

/* Animated spinner */
@keyframes spinner-icon-rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.spinner.icon {
  animation: spinner-icon-rotate 3s linear infinite;
  width: 16.52px;
  height: 16.52px;
}