roll20-character-sheets/Mythras/templates/roll_templates/skill.css

/* Skill Roll Template Styles */
.sheet-rolltemplate-skill {
    background: white;
    font-family: 'Merriweather', serif;
    font-size: 12px;
    line-height: 18px;
    color: black;
}
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode {
    background: #1f1f1f;
    color: whitesmoke;
}
.sheet-rolltemplate-skill div.sheet-border {
    border: 2px solid black;
    font-family: 'Merriweather', serif;
    font-size: 12px;
    line-height: 18px;
    border-radius: 5px;
}
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode div.sheet-border {
    border: 2px solid gray;
}
.sheet-rolltemplate-skill div.sheet-header {
    background: black;
    color: whitesmoke;
}
.sheet-rolltemplate-skill div.sheet-character {
    font-size: 11px;
    text-align: center;
}
.sheet-rolltemplate-skill div.sheet-name {
    font-family: "Sorts Mill Goudy", serif;
    text-align: center;
    font-size: 15px;
}

.sheet-rolltemplate-skill div.sheet-hard-notice {
    padding: 2px 1px 0;
    background: yellow;
    color: black;
}
.sheet-rolltemplate-skill div.sheet-formidable-notice {
    padding: 2px 1px 0;
    background: orange;
    color: black;
}
.sheet-rolltemplate-skill div.sheet-herculean-notice {
    padding: 2px 1px 0;
    background: red;
    color: black;
}
.sheet-rolltemplate-skill div.sheet-hopeless-notice {
    padding: 2px 1px 0;
    background: black;
    color: lightgray;
}
.sheet-rolltemplate-skill span.sheet-result {
    font-family: "Pictos";
    cursor: help;
}

.sheet-rolltemplate-skill div.sheet-table {
    display: table;
    width: 100%;
}

.sheet-rolltemplate-skill div.sheet-tr {
    display: table-row;
    width: 100%;
}
.sheet-rolltemplate-skill div.sheet-th {
    display: table-cell;
    text-align: center;
    background: dimgray;
    color: whitesmoke;
    padding: 1px;
    vertical-align: middle;
    font-weight: normal;
}
.sheet-rolltemplate-skill div.sheet-td {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    padding: 0;
    white-space: nowrap;
}
.sheet-rolltemplate-skill div.sheet-special-header {
    background: dimgray;
    color: whitesmoke;
    text-align: center;
 }

.sheet-rolltemplate-skill div.sheet-space-between {
    display: flex;
    justify-content: space-between;
    padding: 1px;
}

.sheet-rolltemplate-skill .sheet-pictos {
    font-family: Pictos;
}

.sheet-rolltemplate-skill .sheet-help {
    cursor: help;
}

.sheet-rolltemplate-skill .sheet-flex {
    display: flex;
}
.sheet-rolltemplate-skill .sheet-grow {
    flex-grow: 1;
}
.sheet-rolltemplate-skill .sheet-bold {
    font-weight: bold;
}


.sheet-rolltemplate-skill div.sheet-listitem {
    display: flex;
    padding: 2px 1px 0;
}
.sheet-rolltemplate-skill div.sheet-listitem:nth-child(even) {
    background: gainsboro;
}
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode div.sheet-listitem:nth-child(even) {
    background: #1f1f1f;
}
.sheet-rolltemplate-skill div.sheet-very-easy {
    border: 1px solid black;
    border-radius: 10px;
    margin: 1px 2px 0;
    padding: 0 5px 0;
    background: #D9EDF7;
}
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode div.sheet-very-easy {
    border: 1px solid gray;
    background: #123e54;
    color: whitesmoke;
}
.sheet-rolltemplate-skill div.sheet-easy {
    border: 1px solid black;
    border-radius: 10px;
    margin: 1px 2px 0;
    padding: 0 5px 0;
    background: #DFF0D8;
}
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode div.sheet-easy {
    border: 1px solid gray;
    background: #29491d;
    color: whitesmoke;
}
.sheet-rolltemplate-skill div.sheet-standard {
    border: 1px solid black;
    border-radius: 10px;
    margin: 1px 2px 0;
    padding: 0 5px 0;
    background: gainsboro;
}
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode div.sheet-standard {
    border: 1px solid gray;
    background: #595959;
    color: whitesmoke;
}
.sheet-rolltemplate-skill div.sheet-hard {
    border: 1px solid black;
    border-radius: 10px;
    margin: 1px 2px 0;
    padding: 0 5px 0;
    background: #fcf8e3;
}
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode div.sheet-hard {
    border: 1px solid gray;
    background: #5c4f0a;
    color: whitesmoke;
}
.sheet-rolltemplate-skill div.sheet-formidable {
    border: 1px solid black;
    border-radius: 10px;
    margin: 1px 2px 0;
    padding: 0 5px 0;
    background: #FFEBCC;
}
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode div.sheet-formidable {
    border: 1px solid gray;
    background: #992600;
    color: whitesmoke;
}
.sheet-rolltemplate-skill div.sheet-herculean {
    border: 1px solid black;
    border-radius: 10px;
    margin: 1px 2px 0;
    padding: 0 5px 0;
    background: #f2dede;
}
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode div.sheet-herculean {
    border: 1px solid gray;
    background: #811818;
    color: whitesmoke;
}

.sheet-rolltemplate-skill div.sheet-key {
    font-weight: bold;
    text-align: left;
}
.sheet-rolltemplate-skill div.sheet-value {
    text-align: right;
    flex-grow: 1;
}

.sheet-rolltemplate-skill a {
    border-radius: 5px;
    box-sizing: border-box;
    font-size: 1em !important;
    border: solid 1px black !important;
    background: linear-gradient(to bottom, whitesmoke 16%, gainsboro 79%);
    color: black !important;
    padding: 0 2px 0 !important;
    margin: 0 !important;
    text-shadow: none !important;
    box-shadow: none !important;
}
.sheet-rolltemplate-skill a:hover {
    border: solid 1px black !important;
    background: linear-gradient(to bottom, gray 16%, dimgray 79%);
    color: whitesmoke !important;
    text-shadow: none;
}
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode a {
    border: solid 1px black !important;
    background: linear-gradient(to bottom, gray 16%, dimgray 79%);
    color: whitesmoke !important;
}
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode a:hover {
    border: solid 1px black !important;
    background: linear-gradient(to bottom, whitesmoke 16%, gainsboro 79%);
    color: black !important;
}

.sheet-rolltemplate-skill .inlinerollresult,
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode .inlinerollresult {
    display: inline-block;
    text-align: center;
    padding: 0;
    margin: 0;
    color: inherit;
    border: none !important;
    background: transparent !important;
    height: 18px;
    font-weight: inherit;
    font-size: 12px;
    font-family: 'Merriweather', serif;
}
.sheet-rolltemplate-skill .inlinerollresult.fullcrit,
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode .inlinerollresult.fullcrit {
    border: none !important;
    color: inherit;
    background: transparent !important;
    font-weight: inherit;
}
.sheet-rolltemplate-skill .inlinerollresult.fullfail,
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode .inlinerollresult.fullfail {
    border: none !important;
    color: inherit;
    background: transparent !important;
    font-weight: inherit;
}
.sheet-rolltemplate-skill .inlinerollresult.importantroll,
.sheet-rolltemplate-skill.sheet-rolltemplate-darkmode .inlinerollresult.importantroll {
    border: none !important;
    color: inherit;
    background: transparent !important;
    font-weight: inherit;
}