roll20-character-sheets/MERP/merp_2nd_ed_sheet.css

/* For Firefox */
input[type=number] {
    -moz-appearance:textfield;
}

/* Webkit browsers like Safari and Chrome */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

select, option {
    border-radius: 3px;
    border: 1px solid #c1c1c1;
/*    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;*/
    padding: 3px;
}

select::-ms-expand {
  display: none;
}

.sheet-main {
    background-color: #FFFFFF;
    font-family: serif;
    font-weight: normal;
    text-align: left;
    border: 1px solid #969eaa;
    margin: 5px;
    min-width: 850px;
}

.sheet-main .sheet-full-width {
    min-width: 800px;   
}

.sheet-main .sheet-fill-width {
    width: 100%;   
}

.sheet-main .sheet-align-center {
    text-align: center;
}

.sheet-main label {
    text-align: right;
    font-weight: normal;
    text-transform: uppercase;
    font-size: 1em;
}

.sheet-main input {
    border-radius: 0px;
    outline: 0px;
    border-width: 0 0 1px 0;
    border-color: #d1d1d1;
}

.sheet-main input:focus {
    background-color: #d9f9f1;
}

.sheet-main input:disabled {
    color: #3d6568;
    width: 27px;
    border-width: 0;
    background-color: #ffffff;
} 

.sheet-main .sheet-table-section-shaded input:disabled {
    background-color: #f4f4f4;
} 

.sheet-main .sheet-table-spelllist-row {
    padding: 2px 2px 2px 2px;
}

.sheet-main .sheet-table-spelllist-row td {
    padding: 2px 2px 2px 2px;
    text-align: center;
    vertical-align: middle;
}

.sheet-main select.sheet-text-field-spell-class {
    width: 150px;
}

.sheet-main .sheet-text-field-weapon-name {
    width: 120px;
}

.sheet-main select.sheet-text-field-weapon-type {
    width: 90px;
}


.sheet-main input[type=number].sheet-text-weapon-stat {
    width: 30px;
    text-align: right;
}

.sheet-main input[type=number].sheet-text-weapon-stat-small {
    width: 20px;
    text-align: right;
}

.sheet-main input:disabled.sheet-autocalc-bonus {
    width: 45px;
    text-align: right;
} 

.sheet-main input:disabled.sheet-autocalc-total {
    font-weight: bold;
} 

.sheet-main input:disabled.sheet-autocalc-stat-right, .sheet-main input.sheet-autocalc-stat-right {
    width: 27px;
    text-align: right;
} 

.sheet-main input:disabled.sheet-autocalc-stat {
    width: 27px;
    text-align: left;
} 

.sheet-main input:disabled.sheet-autocalc-weight {
    width: 50px;
} 

.sheet-main input[type=number] {
    text-align: right;
    width: 27px;
}

.sheet-main input[type=number].sheet-bodydev {
    text-align: center;
    border-width: 1px 1px 1px 1px;
    font-size: 0.6em;
    width: 14px;
    height: 15px;
}

.sheet-main .sheet-stat-label {
    font-weight: normal;
}

.sheet-main .sheet-skill-label {
    font-weight: normal;
}

.sheet-main .sheet-devpts-label, .sheet-main .sheet-devpts-label input.sheet-autocalc-devpts-right {
    font-weight: normal;
    color: #a1a1a1;
    width: 20px;
}


.sheet-secondaryskills-grid-container {
    display: grid;
    grid-template-columns: 130px 7px 177px 92px 31px 81px 31px 31px 31px 31px 31px 102px 33px
}

.sheet-main .sheet-skill-label-bold {
    font-weight: bold;
}

.sheet-main .sheet-table-cell-center {
    text-align: center;
}

.sheet-main .sheet-skills-table, .sheet-main .sheet-stats-table, .sheet-main .sheet-spells-table, .sheet-main .sheet-resistances-table {
    border-collapse: collapse;
    margin: 3px;
    width: 100%;
}

.sheet-main .sheet-skills-table, .sheet-main .sheet-spells-table {
    min-width: 800px;
}

.sheet-main th {
    text-align: center;
}

.sheet-main .sheet-spells-table td, .sheet-main .sheet-spells-table th {
    padding-right: 3px;
    padding-left: 3px;
}

.sheet-main .sheet-border-box {
    border: 1px solid #c1c1c1;
    border-radius: 4px;
    padding: 5px;
    margin: 2px;
}

.sheet-main .sheet-border-box h3 {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 1.2em;
}

.sheet-main .sheet-stat-bonus-field {
    width: 2em;
}

.sheet-main .sheet-skills-table-head {
    text-align: center;
}

.sheet-main .sheet-skills-table td, .sheet-main .sheet-stats-table td {
    padding-left: 2px;
    padding-right: 2px;
}

.sheet-main .sheet-top-padding {
    padding-top: 15px;
}

.sheet-main .sheet-secondaryskill-table  {
    min-width: 800px;
}

.sheet-main .sheet-secondaryskill-table-row  {
    min-width: 800px;
}

.sheet-main .sheet-secondaryskill-table .sheet-secondaryskill-cell {
    padding-left: 2px;
    padding-right: 2px;
}

.sheet-main .sheet-secondaryskill-table .sheet-secondaryskill-name {
    width: 130px;
}

.sheet-main .sheet-secondaryskill-table .sheet-secondaryskill-5ranks {
    width: 173px;
}

.sheet-main .sheet-secondaryskill-table .sheet-secondaryskill-2ranks {
    width: 88px;
}

.sheet-main .sheet-secondaryskill-label {
    width: 130px;
}

.sheet-main .sheet-secondaryskill-stat {
    width: 45px;
}

.sheet-main .sheet-secondaryskill-type {
    width: 50px;   
}

.sheet-main .sheet-skill-heading {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 1.2em;
    padding-left: 10px;
}

.sheet-main .sheet-point-indicator {
    border-radius: 3px;
    border: 1px solid #c1c1c1; 
    padding: 0px; 
    margin-top: 2px;
    min-height: 58px;
}

.sheet-main .sheet-point-indicator-header {
    font-size: 1.0em; 
    min-height: 30px;
}

.sheet-main .sheet-point-indicator-header-text {
    font-weight: bold; 
    font-size: 1.0em; 
    padding: 3px;
    line-height: 30px;
}

.sheet-main input[type=number].sheet-point-indicator-header-score {
    width: 27px;
    text-align: center; 
    font-weight: normal;
}

.sheet-main input[type=number].sheet-point-indicator-score {
    font-size: 1.2em; 
    text-align: center; 
    width: 40px;
    border: 0px;
    font-weight: bold;
}

.sheet-main .sheet-languages-box {
    min-height: 240px; 
    width: 206px;
}

.sheet-main .sheet-attacks-box {
    min-height: 240px; 
    width: 470px;
}

.sheet-main .sheet-abilities-box {
    min-height: 240px; 
    width: 220px;
}

.sheet-main .sheet-creature-abilities-box {
    min-height: 240px; 
    width: 325px;
}

.sheet-main .sheet-text-field-creature-ability {
    width: 300px;
}

.sheet-main .sheet-table-section-shaded, .sheet-main .sheet-table-section-shaded input, .sheet-main .sheet-table-section-shaded input:disabled {
    background-color: #f4f4f4;
}

.sheet-main .sheet-text-field-short {
    width: 50px;
}

.sheet-main .sheet-text-field-critical {
    width: 65px;
}

.sheet-main .sheet-text-field-critical-short {
    width: 35px;
}

.sheet-main input:disabled.sheet-text-field-medium {
    width: 100px;
}

.sheet-main .sheet-text-field-medium {
    width: 100px;
}

.sheet-main .sheet-text-field-language {
    width: 150px;
}

.sheet-main .sheet-text-field-spellname {
    width: 120px;
    font-weight: bold;
}

.sheet-main .sheet-text-field-note {
    width: 300px;
}

.sheet-main .sheet-text-field-itemnote {
    width: 350px;
}

.sheet-main .sheet-fields-rowlike {
    display: table-row;
}

.sheet-main .sheet-fields-celllike {
    display: table-cell;
}

.sheet-main .sheet-tablelike {
    display: table;
}

.sheet-main-heading {
    width: 300px;
    font-weight: bold;
    font-size: 1.5em;
    padding: 3px;
}

.sheet-main .sheet-table-heading {
    display: table-header-group;
    font-weight: bold;
}

.sheet-main .sheet-table-row, .sheet-main .sheet-tablelike .repitem {
    display: table-row;
    font-weight: normal;
}

.sheet-main .sheet-tablelike .repcontainer {
    display: table-row-group;
}

.sheet-main .sheet-tablelike .itemcontrol {
    height: auto !important;
}

.sheet-main .sheet-table-cell {
    display: table-cell;
    padding-left: 3px;
    padding-right: 3px;
}

.sheet-main .sheet-table-cell-no-padding {
    display: table-cell;
    padding-left: 0px;
    padding-right: 0px;
}

.sheet-main .sheet-horizontal-spacer {
    width: 3px;
}

.sheet-main .sheet-table-stat-label {
    text-align: right;
}

.sheet-main .sheet-table-stat-value {
    text-align: left;
}

.sheet-main .sheet-action-type-label {
    font-weight: normal;
}

.sheet-main .sheet-personal-box {
    min-height: 344px; 
    width: 352px;
}

.sheet-main .sheet-resistance-box {
    min-height: 344px; 
    width: 443px;
}

.sheet-main .sheet-appearance-box {
    min-height: 148px; 
    width: 268px;
}

.sheet-main .sheet-status-box {
    min-height: 148px;
    width: 527px;
}

.sheet-main .sheet-movement-box {
    min-height: 165px; 
    width: 268px;
}

.sheet-main .sheet-creature-status-box {
    min-height: 165px;
    width: 527px;
}

.sheet-main .sheet-stats-box {
    width: 350px;
}

.sheet-main .sheet-spelllist-box {
    margin: 2px;
}

.sheet-main .sheet-spelllist-name {
    width: 300px;
    font-weight: bold;
    font-size: 1.5em;
}

.sheet-main .sheet-text-field-race {
    width: 140px;
}

.sheet-main .sheet-text-field-profession {
    width: 120px;
}

.sheet-main .sheet-text-field-creature-speed {
    width: 120px;
}

.sheet-main .sheet-table-pointbox {
    border: 1px solid #000000;
    border-radius: 3px;
    padding: 5px;
}

.sheet-main .sheet-table-pointbox-header, .sheet-main .sheet-table-pointbox-header input {
    background-color: #000000;
    color: #ffffff;
}

.sheet-main input.sheet-table-pointbox-value {
    font-weight: bold;
    font-size: 1.5em;
    text-align: center;
    vertical-align: middle;
}

.sheet-hidden {
    display: none;
}


.sheet-rolltemplate-character {
    font-family: serif;
    font-size: 1.1em;
    padding: 3px;
    width: 90%;
    font-style: italic;
}

.sheet-rolltemplate-container {
    font-family: serif;
    background-color: #f1f1f1;
    color: #000000;
    border: 1px solid #a1a1a1;
    border-radius: 10px;
    width: 90%;
    padding: 3px;
}

.sheet-rolltemplate-container .sheet-rolltemplate-header {
    background-color: #000000;
    color: #f1f1f1;
    padding: 3px;
    border-radius: 5px;
    text-align: center;
}

.sheet-rolltemplate-container .sheet-rolltemplate-header .sheet-rolltemplate-heading {
    font-size: x-large;
    line-height: 30px;
    vertical-align: middle;
}

.sheet-rolltemplate-container .sheet-rolltemplate-header .sheet-rolltemplate-subheading {
    font-weight: normal;
    font-size: smaller;
    text-transform: uppercase;
}

.sheet-rolltemplate-container .sheet-rolltemplate-results {
    margin: 5px;
    width: 100%;
    text-align: center;
}

.sheet-rolltemplate-container .sheet-rolltemplate-modifiers {
    width: 100%;
    margin-top: 5px;
    text-align: center;
    border-width: 1px 0px 0px 0px;
    border-style: solid;
    border-color: #a1a1a1;
}

.sheet-rolltemplate-container .sheet-rolltemplate-modifier-label {
    text-align: right;
    width: 50%;
    color: #a1a1a1;
    padding-top: 5px;
}

.sheet-rolltemplate-container .sheet-rolltemplate-modifier-fumble {
    text-align: center;
    width: 100%;
    color: #a1a1a1;
    padding: 5px;
}


.sheet-rolltemplate-container .sheet-rolltemplate-total {
    padding-top: 10px;
    text-align: center;
    line-height: 2em;
    vertical-align: bottom;
}

.sheet-rolltemplate-container .sheet-rolltemplate-label {
    vertical-align: top;
    text-align: center;
    font-size: smaller;
    color: #a1a1a1;
}

.sheet-rolltemplate-container .sheet-rolltemplate-results .sheet-rolltemplate-total .inlinerollresult{
    font-size: 2em;
}

.sheet-main .sheet-heading {
    background-color: #000000;
    color: #ffffff;
    padding: 3px;
    width: 840px;
}

.sheet-main .sheet-heading h2 {
    background-color: #000000;
    color: #ffffff;
    padding: 3px;
}

.sheet-main button[type=roll].sheet-rolld100::before {
  font-family: dicefontd10;
  content: "t";
}


.sheet-main input[type="checkbox"].sheet-visibility-toggle {
    opacity: 0;
    width: 16px;
    height: 16px;
    position: relative;
    top: 5px;
    left: 6px;
    margin: -10px;
    cursor: pointer;
    z-index: 1;
}

/* Fake checkbox */
input[type="checkbox"].sheet-visibility-toggle + span::before {
    margin-right: 4px;
    line-height: 14px;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    
    content: "▼";
    width: 14px;
    height: 14px;
    font-size: 12px;
}

input[type="checkbox"].sheet-visibility-toggle:checked + span::before {
    content: "►";
}

input.sheet-visibility-toggle:checked ~ div.sheet-togglable-visibility {
    display: none;
}

input.sheet-tab1:checked ~ div.sheet-tab1,
input.sheet-tab2:checked ~ div.sheet-tab2,
input.sheet-tab3:checked ~ div.sheet-tab3,
input.sheet-tab4:checked ~ div.sheet-tab4,
input.sheet-tab5:checked ~ div.sheet-tab5,
input.sheet-tab6:checked ~ div.sheet-tab6 {
    display: inline-block;
}

.sheet-main input.sheet-tab {
    width: 100px;
    height: 40px;
    cursor: pointer;    
    position: relative;
    opacity: 0;
    z-index: 9999;
}

.sheet-main span.sheet-tab {
    text-align: center;
    display: inline-block;
    vertical-align: middle;

    font-size: 13px;    
    background-color: #f4f4f4;
    color: #000000;
    font-weight: bold;

    width: 100px;
    height: 40px;
    line-height: 40px;
    cursor: pointer;    
    position: relative;
    vertical-align: middle;
    margin-left: -101px;
}

.sheet-main input.sheet-tab1:checked + span.sheet-tab1,
.sheet-main input.sheet-tab2:checked + span.sheet-tab2,
.sheet-main input.sheet-tab3:checked + span.sheet-tab3,
.sheet-main input.sheet-tab4:checked + span.sheet-tab4,
.sheet-main input.sheet-tab5:checked + span.sheet-tab5,
.sheet-main input.sheet-tab6:checked + span.sheet-tab6 {
    background: #000000;
    color: #f1f1f1;
    border-radius: 5px 5px 0px 0px;
    vertical-align: middle;
}

.sheet-main .sheet-tab-content { 
    display: none;
    margin: 5px; 
    width: 840px;
}