@charset "utf-8";

.ratio-graph {
    display: flex;
    width: 100%;
    align-items: center;
    height: 1rem;
}

.ratio-graph p {
    overflow: hidden;
}

.ratio-graph-left {
    color: #f9ffff;
    text-align: center;
    align-content: center;
    height: 120%;
    background: linear-gradient(to bottom, #c5d80a, #028040);
    white-space: nowrap;
}

.ratio-graph-center {
    width: 1.2px;
    background: #333;
    height: 140%;
}

.ratio-graph-right {
    color: #f9ffff;
    text-align: center;
    align-content: center;
    height: 120%;
    background: linear-gradient(to bottom, #f1a486, #ca000c);
    white-space: nowrap;
}

.ratio-graph-nodata {
    color: #f9ffff;
    text-align: center;
    align-content: center;
    height: 120%;
    width: 100%;
    background: #b4b4b4;
    white-space: nowrap;
}