label, span, li { font-family: serif; font-size: xx-small; font-size: 1.1vmin; text-transform: uppercase; padding: 0px; margin: 0px; line-height: 12px; }
label { margin-top: 5px; text-align: center; }
hr { margin: 10px 0px; color: #595959; background-color: #595959; height: 1.5px; border: none; }
input[type="text"], textarea { font-family: cursive; box-shadow: none; border: 1px solid #595959; padding: 4px; margin: 0px; width: 180px; } 
input[type="text"] { padding: 4px; height: 28px; } 
textarea { resize: none; padding-left: 5px; margin: 0px; width: 170px; height: 36px; } 

/* This is to remove the arrow of select element in IE */
select::-ms-expand { display: none; } 
select { -webkit-appearance: none; appearance: none; margin: 0px; line-height: 12px; padding: 0px 8px; text-align-last: center; } input[type="checkbox"] { box-shadow: none; color: white; background: white; } 

.sheet-container { border: 1px solid #595959; background: white; min-height: 600px; } 
.sheet-logo { width: 140px; margin: auto; }
.sheet-logo .sheet-mutate { filter: invert(100%) grayscale(100%); } 

div.sheet-wounds { text-align: left; }
div.sheet-wound.sheet-row { vertical-align: bottom; }
span.sheet-wound.sheet-value { font-size: 1.5em; font-weight: bold; } span.sheet-consequence { display: inline-block; width: 65%; height: 100%; text-align: left; margin-left: 15px; }

div.sheet-invasive { border-bottom: 1px solid #595959; margin-bottom: 5px; height: 5px;} 
div.sheet-invasive label { text-align: center; position: relative; top: 0px; color: white; background: #595959; width: 20%; padding: 0px; margin: 0px; margin-left: auto; margin-right: auto; z-index: 2; line-height: 10px; }
div.sheet-invasive label.sheet-divine-favor { width: 70px; } 
div.sheet-invasive label.sheet-advantage-dice { width: 75px; } 

.sheet-column { width: 180px; padding 5px; margin-left: 5px; text-align: center; float: left; } 
.sheet-column.sheet-narrow { width: 60px; } 
.sheet-column.sheet-wide { width: 260px; } 

ul { padding: 0px; margin: 0px; } 
li { list-style: none; } 
.sheet-notes { border: 1px solid #595959; border-radius: 5px; margin: 5px; padding: 5px; } 
.sheet-notes li { text-align: left; margin-left: 10px; text-indent: -10px } 
.sheet-notes label { margin: 0px; text-align: center; font-size: .75em; } 

input.sheet-oathgiver { border: none; border-bottom: 1px solid #595959; border-radius: 0px; width: 136px; } 
input[type="number"].sheet-oathcount { border: 1px solid #595959; width: 40px; } 
input.sheet-advantage { border: none; border-bottom: 1px solid #595959; border-radius: 0px; width: 136px; } 

div.sheet-armor.sheet-checklist { text-align: left; line-height: 5px; margin-left: 10px; text-indent: -10px; }
div.sheet-armor.sheet-checklist div.sheet-row { margin-top: 2px; }
div.sheet-armor span { line-height: 7px; font-size: .5em; } 

div.sheet-range { display: block; margin: 0px 10px; position: relative; top: -5px; } 
div.sheet-range label { font-size: .5em; text-align: center; } 
div.sheet-range input { width: 50px; height: 15px; line-height: 12px; font-size: .75em; } 

div.sheet-ability { display: inline-block; margin: 0px 5px; vertical-align: top; }
div.sheet-ability label { margin: 0px; padding: 0px; text-align: center; } 

div.sheet-element { display: inline-block; padding-bottom: 2px; margin: 0px 5px; vertical-align: top; }
div.sheet-element label { margin: 0px; padding: 0px; text-align: center; } 
div.sheet-element label { font-size: .5em; text-align: center;  vertical-align: middle; } 
div.sheet-element input { width: 46px; }
div.sheet-element textarea { width: 85px; height: 60px; }


.sheet-repeating-field { margin-top: 5px; }
.sheet-repeating-field label { text-align: center; } 
.repcontrol { min-height: 27px; } 
.repcontrol .btn { border: medium none; color: white !important; background: none; box-shadow: none; } 
.repcontrol .btn:focus { outline: 0; } 
.repcontrol .repcontrol_edit:after { content: '('; visibility: visible; font-family: pictos; background-color: #fff; border: 1px solid #595959; border-radius: 2px; font-size: 12px; height: 12px; width: 12px; padding: 2px 4px 2px 4px; color: #595959; } 
.editmode ~ .repcontrol .repcontrol_edit:after { content: ')'; } 
.repcontrol .repcontrol_add:before { content: '&'; visibility: visible; font-family: pictos; background-color: #fff; border: 1px solid #595959; border-radius: 2px; font-size: 12px; height: 12px; width: 12px; padding: 2px 4px 2px 4px; color: #595959; } 
.repcontrol .repcontrol_edit:hover:after, .repcontrol .repcontrol_add:hover:before { background-color: #EFEFEF; } 
.sheet-resources .repcontrol { margin-top: -10px; } 
.itemcontrol { z-index: 10; } 
.itemcontrol .repcontrol_del { font-size: 10px; margin-top: 3px; padding: 0px; height: 18px; width: 18px; } 
.itemcontrol .repcontrol_move { font-size: 10px; margin-top: 3px; padding: 0px; height: 18px; width: 18px; }

div.sheet-impairment { margin: auto; width: 45px; height: 30px; position: relative; }

select.sheet-die { position: relative; top: 0px; left: 0px; border: 1px solid #595959; width: 100%; height: 100%; border-radius: 0; }
select.sheet-die.sheet-advantage { border: 1px solid #595959; width: 40px; height: 25px;}

.sheet-checkboxes { display: block; padding-top: 5px; }
label.sheet-checkbox { display: inline-block; position: relative; padding: 0px; margin: 0px 4px; cursor: pointer; font-size: .5em; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; height: 10px; width: 10px; }
label.sheet-checkbox.sheet-glory { margin: 0px 2px; }
label.sheet-checkbox.sheet-favor { margin: 0px 6px; }
label.sheet-checkbox.sheet-wound { width: 12px; height: 12px; vertical-align: bottom; margin: 3px 0px; padding: 3px; }
label.sheet-checkbox.sheet-small, span.sheet-checkbox.sheet-small { height: 5px; width: 5px; margin: 0px; margin-right: 1px; }
label.sheet-checkbox input[type="checkbox"] { position: absolute; top: 0px; left: 0px; width: 100%; opacity: 0; cursor: pointer; }
.sheet-checkbox input:checked ~ .sheet-checkmark { background-color: #595959; color: white; } 
.sheet-checkbox input:checked ~ .sheet-checkmark:after { display: block; } 
.sheet-checkmark:after { content: ""; position: absolute; display: none; } 
.sheet-checkmark { position: absolute; top: 0; left: 0; height: 100%; width: 100%; border: 1px solid #595959; text-align: center; }

span.sheet-impairment.sheet-checkmark { width: 5px; height: 5px; border: 1px solid #595959; } 
div.sheet-corner { position: absolute; height: 7px; width: 7px; } 
div.sheet-corner.sheet-top { border-top: 1px solid white; border-bottom: 1px solid #595959; top: 0px; } 
div.sheet-corner.sheet-bottom { border-top: 1px solid #595959; border-bottom: 1px solid white; bottom: 0px; } 
div.sheet-corner.sheet-left { border-left: 1px solid white; border-right: 1px solid #595959; left: 0px; } 
div.sheet-corner.sheet-right { border-left: 1px solid #595959; border-right: 1px solid white; right: 0px; } 
label.sheet-checkbox.sheet-corner { position: absolute; height: 5px; width: 5px; } 
label.sheet-checkbox.sheet-corner.sheet-top { top: -1px; } 
label.sheet-checkbox.sheet-corner.sheet-bottom { bottom: 1px; } 
label.sheet-checkbox.sheet-corner.sheet-left { left: -1px; } 
label.sheet-checkbox.sheet-corner.sheet-right { right: 1px; }