#skills-table > h3 {
    margin-top: 65px;
}

#skills-table .table {
    min-width: 930px;
}

#skills-table thead tr {
    border-color: var(--komatsu-grey);
}

#skills-table thead th {
    color: #7030A0;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: 26px;
    text-align: center;
}

#skills-table tbody .vertical-header-wrapper {
    background-color: var(--komatsu-grey);
    text-align: center;
    width: 42px;
    border-right: solid 10px #ffffff;
}

    #skills-table tbody .vertical-header-wrapper .vertical-header {
        writing-mode: vertical-rl;
        transform: rotate(-180deg);
        display: inline-block;
        color: #ffffff;
        text-align: center;
        font-size: 20px;
        font-style: normal;
        font-weight: 900;
        line-height: 26px;
        letter-spacing: 2px;
    }

#skills-table tbody th {
    color: var(--font-black);
    font-size: 18px;
    font-style: normal;
    font-weight: 900;
    line-height: 26px;
    padding-left: 0;
    padding-top: 13px;
    padding-bottom: 13px;
}

#skills-table tbody tr {
    border-color: var(--komatsu-grey);
}

    #skills-table tbody tr td {
        padding: 8px;
        height: 53px;
        width: 130px;
    }

@media (min-width: 1200px) {
    #skills-table tbody tr td {
        width: 160px;
    }
}

@media (min-width: 1400px) {
    #skills-table tbody tr td {
        width: 170px;
    }
}

#skills-table tbody tr td .cell {
    height: 100%;
    width: 100%;
    display: inline-block;
    float: left;
    max-height: 43px;
}

    #skills-table tbody tr td .cell.foundation.active {
        opacity: 0.20000000298023224;
        background: var(--komatsu-purple);
    }

    #skills-table tbody tr td .cell.intermediate.active {
        opacity: 0.44999998807907104;
        background: var(--komatsu-purple);
    }

    #skills-table tbody tr td .cell.proficient.active {
        opacity: 0.6000000238418579;
        background: var(--komatsu-purple);
    }

    #skills-table tbody tr td .cell.advanced.active {
        opacity: 0.800000011920929;
        background: var(--komatsu-purple);
    }

    #skills-table tbody tr td .cell.mastery.active {
        background: var(--komatsu-purple);
    }
