/* Global stylings
============================= */

@import url('https://fonts.googleapis.com/css?family=Roboto|Bellota&display=swap');

.charsheet {
    font-family: 'Apple Chancery', 'Bellota', 'Palatino Linotype', arial;
}

* , *:before, *:after{
    box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    -ms-box-sizing:border-box;
}

textarea {
    border-radius: 6px;
    line-height: 20px;
    width: 98%;
    background: var(--input-bg-color);
    color: var(--input-text-color);
}

input[type=number], input[type=text], select {
    border-radius: 6px;
    line-height: 20px;
    height: 30px;
    max-width: 300px;
    vertical-align: middle;
    background: var(--input-bg-color);
    color: var(--input-text-color);
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

td, th {
    text-align: left;
    padding: 3px;
    width: 150px;
}

button[type=roll] {
    height: 23px;
    border-radius: 4px;
}

hr {
    margin: 12px;
    border-color: var(--divider-color);
}

.sheet-flex {
    display: flex;
    justify-content: space-around;
}

.sheet-flex-column {
    display: flex;
    flex-direction: column;
}

.sheet-flex-between {
    display: flex;
    justify-content: space-between;
}

.sheet-flex-vertical-center {
    align-items: center;
}

.sheet-full-width {
    min-width: 98%
}

.sheet-caps {
    text-transform: uppercase;
}

.sheet-pictos {
    font-family: "pictos";
}

.sheet-font-12 {
    font-size: 12px;
}

/* Default Repeating section buttons (Add, Modify, Done)
============================= */
.repcontainer .itemcontrol {
    z-index: 100;
}

.repcontrol_add,
.repcontrol_edit {
    background: transparent none repeat scroll 0% 0%;
    border: medium none;
    box-shadow: none;
    color: var(--main-bg-color)
}

button.btn.repcontrol_add::before,
button.btn.repcontrol_edit::after {
    visibility: visible;
    font-family: 'pictos';
    text-align: center;
    text-shadow: 0 1px 1px rgba(255,255,255,0.75);
    vertical-align: middle;
    background-color: #f5f5f5;
    background-image: linear-gradient(#fff,#e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #ccc;
    border-bottom-color: rgb(204, 204, 204);
    border-bottom-color: #bbb;
    border-radius: 4px;
    cursor: pointer;
    padding: 4px 6px;
    color: #373737;
}

button.btn.repcontrol_add::before {
    content: "&";
}

button.btn.repcontrol_edit::after {
    content: "(";
}

.editmode ~ .repcontrol .repcontrol_edit::after {
    content: ')';
}

button.btn.repcontrol_add:hover::before,
button.btn.repcontrol_edit:hover::after {
    background: #e4e4e4;
}

.repcontrol_del {
    background-color: darkred;
    font-family: "pictos";
}

/* Colors
============================= */
.charsheet {
    --main-bg-color: #eeffff;
    --header-bg-color: #aaeeaa;
    --header-text-color: #000;
    --selected-item-bg-color: #299;
    --selected-item-text-color: #fff;
    --unselected-item-bg-color: #00cdcd;
    --unselected-item-text-color: #000;
    --divider-color: lightgray;
    --icon-bg-color: #88394d;
    --input-bg-color: #fff;
    --input-text-color: #000;
}

.sheet-mainBgColor[value='white']       ~ .sheet-characterSheet { --main-bg-color: #fff;    --divider-color: #90939c; }
.sheet-mainBgColor[value='grayscale']   ~ .sheet-characterSheet { --main-bg-color: #f3f3f3; --divider-color: #000; }
.sheet-mainBgColor[value='book']        ~ .sheet-characterSheet { --main-bg-color: #f3efe6; --divider-color: #424242; }
.sheet-mainBgColor[value='summer']      ~ .sheet-characterSheet { --main-bg-color: #fef7ed; --divider-color: #424242; }
.sheet-mainBgColor[value='fall']        ~ .sheet-characterSheet { --main-bg-color: #fde7e8; --divider-color: #cd5142; }
.sheet-mainBgColor[value='winter']      ~ .sheet-characterSheet { --main-bg-color: #fafefe; }
.sheet-mainBgColor[value='spring']      ~ .sheet-characterSheet { --main-bg-color: #f8f9f3; --divider-color: #000; }
.sheet-mainBgColor[Value='lilac']       ~ .sheet-characterSheet { --main-bg-color: #fbeeff; --divider-color: #000; }

.sheet-headerBgColor[value='blue']      ~ .sheet-characterSheet { --header-bg-color: #45619e; --header-text-color: #fff; }
.sheet-headerBgColor[value='grayscale'] ~ .sheet-characterSheet { --header-bg-color: #6d6d6d; --header-text-color: #fff; }
.sheet-headerBgColor[value='book']      ~ .sheet-characterSheet { --header-bg-color: #f5edac; }
.sheet-headerBgColor[value='summer']    ~ .sheet-characterSheet { --header-bg-color: #e0861b; --header-text-color: #fff; }
.sheet-headerBgColor[value='fall']      ~ .sheet-characterSheet { --header-bg-color: #d1425e; --header-text-color: #fff; }
.sheet-headerBgColor[value='winter']    ~ .sheet-characterSheet { --header-bg-color: #318baa; --header-text-color: #fff; }
.sheet-headerBgColor[value='spring']    ~ .sheet-characterSheet { --header-bg-color: #9ece84; --header-text-color: #fff; }
.sheet-headerBgColor[value='lilac']     ~ .sheet-characterSheet { --header-bg-color: #b394d8;; --header-text-color: #fff; }

.sheet-iconBgColor[value='book']        ~ .sheet-characterSheet { --icon-bg-color: #5bb2b6; }
.sheet-iconBgColor[value='grayscale']   ~ .sheet-characterSheet { --icon-bg-color: #8f8f8f; }
.sheet-iconBgColor[value='summer']      ~ .sheet-characterSheet { --icon-bg-color: #c40b45; }
.sheet-iconBgColor[value='fall']        ~ .sheet-characterSheet { --icon-bg-color: #e3801d; }
.sheet-iconBgColor[value='winter']      ~ .sheet-characterSheet { --icon-bg-color: #0d7075; }
.sheet-iconBgColor[value='spring']      ~ .sheet-characterSheet { --icon-bg-color: #87ceeb; }
.sheet-iconBgColor[value='lilac']       ~ .sheet-characterSheet { --icon-bg-color: #915173; }

.sheet-radioBgColor[value='blue']       ~ .sheet-characterSheet { --selected-item-bg-color: #45619e; --unselected-item-bg-color: #90b2ff;}
.sheet-radioBgColor[value='grayscale']  ~ .sheet-characterSheet { --selected-item-bg-color: #585858; --unselected-item-bg-color: #a3a3a3;}
.sheet-radioBgColor[value='book']       ~ .sheet-characterSheet { --selected-item-bg-color: #9f8156; --unselected-item-bg-color: #d2bb95;}
.sheet-radioBgColor[value='summer']     ~ .sheet-characterSheet { --selected-item-bg-color: #f1c076; --unselected-item-bg-color: #ffdcaa;}
.sheet-radioBgColor[value='fall']       ~ .sheet-characterSheet { --selected-item-bg-color: #bd3b55; --unselected-item-bg-color: #fe849b;}
.sheet-radioBgColor[value='winter']     ~ .sheet-characterSheet { --selected-item-bg-color: #028493; --unselected-item-bg-color: #a5d6ea;}
.sheet-radioBgColor[value='spring']     ~ .sheet-characterSheet { --selected-item-bg-color: #72aa75; --unselected-item-bg-color: #d9e5b7;}
.sheet-radioBgColor[value='lilac']      ~ .sheet-characterSheet { --selected-item-bg-color: #865abb; --unselected-item-bg-color: #f2ccff;}

/* ============= End Colors ================== */

.sheet-logo {
    width: auto;
    height: 120px;
    margin-top: 10px;
}

.sheet-gmlogo {
    width: 50%
}

.sheet-header {
    color: var(--header-text-color);
    background-color: var(--header-bg-color);
    font-size: 1.05em;
    border-radius: 4px;
    padding: 1px 5px;
}

.sheet-partyOptions {
    display: flex;
    justify-content: flex-start;
    margin: 9px;
}

.sheet-personalItems {
    justify-content: flex-start;
}

.sheet-round-box {
    border: 2px solid gray;
    border-radius: 9px;
    padding: 9px;
}

/* Grid for the HP, MP, and Condition
============================= */

.sheet-hpmpgrid {
    display: grid;
    grid-template-columns: repeat(2, .5fr) 1fr;
    grid-template-rows: .25fr 1fr;
    grid-column-gap: 2px;
    grid-row-gap: 0px;
}

.sheet-hpHeader { grid-area: 1 / 1 / 2 / 2; }
.sheet-mpHeader { grid-area: 1 / 2 / 2 / 3; }
.sheet-hp { grid-area: 2 / 1 / 3 / 2; }
.sheet-mp { grid-area: 2 / 2 / 3 / 3; }
.sheet-condHeader { grid-area: 1 / 3 / 2 / 4; }
.sheet-condition { grid-area: 2 / 3 / 3 / 4; }


.sheet-hpmpHeader {
    padding: auto;
    justify-content: flex-start;
    font-weight: bold;
    border-radius: 4px;
    padding: 0 5px;
}

.sheet-icon {
    width: 50px;
    height: auto;
    background: var(--icon-bg-color);
    border-radius: 6px;
    margin: 3px;
}

.sheet-icon-small{
    width: 30px;
    padding: 3px;
}

.sheet-condionBar {
    align-items: center;
    padding: 6px 0 0 0;
    margin: 0px;
    font-size: 1em;
}

.sheet-condionBar label {
    padding: 0px;
}

.sheet-condAttribute {
    height: 20px;
    width: 50px;
    line-height: 20px;
    padding: 0;
    margin: 0 5px;
    text-align: center;
}

/* Grid for the main stat boxes STR, DEX, INT, SPI
============================= */
.sheet-coreStatGrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.sheet-coreStatGrid select {
    width: 50px;
    text-align: center;
    text-align-last: center;
}

.sheet-coreStatText         { grid-area: 1 / 1 / 2 / 2; font-size: 1.25em; text-align: center; font-weight: bold;}
.sheet-coreStatBaseDie      { grid-area: 2 / 1 / 3 / 2; text-align: center; align-items: center;}
.sheet-coreStatCurrentDie   { grid-area: 1 / 2 / 3 / 3; align-items: center; justify-content: end}

.sheet-coreStatCurrentDie input[type='number'] {
    text-align: center;
    width: 60px;
    height: 50px;
    font-size: 2em;
    margin: 6px 0 0 0;
}

/*============================= */

.sheet-charoptions {
    width: 100px;
    position: relative;
    top: 5px;
}

.sheet-classOtherinput {
    width: 230px;
}

.sheet-attributeType {
    width: 65px;
    position: relative;
    top: 5px;
    text-align: center;
    text-align-last: center;
}

.sheet-classSkillRoll {
    margin-left: 10px;
}

.sheet-spellRow {
    margin-right: 2px;
    margin-top: 2px;
}

.sheet-spellDetails {
    margin-top: 5px;
    margin-left: 5px;
    vertical-align: top;
    display: inline-block;
}

.sheet-spellEffect {
    height: 75px;
}

.sheet-spellEffectDisplay {
    padding-left: 10px;
    padding-bottom: 10px;
    margin: 0 5px;
    font-family: 'Roboto';
    white-space: pre-wrap;
    word-break: break-word;
}

.sheet-spellTypes {
    width: 130px;
    position: relative;
}

.sheet-spellDuration {
    width: 130px;
}

.sheet-spellTarget {
    width: 130px;
}

.sheet-spellRange {
    width: 130px;
}

.sheet-dtype {
    width: 60px;
    position: relative;
    top: 5px;
}

.sheet-skillCheck {
    position: relative;
    bottom: 5px;
    top: 1px;
}

.sheet-skillCheckColumn {
    min-width: 30%;
}

.sheet-conditionCheck {
    position: relative;
    bottom: 5px;
}

.sheet-coreAttributes {
    display: flex;
    flex-flow: row;
    justify-content: space-around;
}

.sheet-attrLabel {
    margin: 6px 0 3px 0;
    width: 98%;
    padding: 2px 5px;
    border-radius: 3px;
}

.sheet-healthLabel, .sheet-infoLabel {
    position: relative;
    top: 5px;
}

.sheet-journeyLabel {
    font-size: 13px;
    display: block;
    position: relative;
    top: 2px;
    left: 3px;
    padding-bottom: 2px;
}

.sheet-journeyMod {
    float: right;
    margin-bottom: 2px;
}

.sheet-itemLabel {
    position: relative;
    top: 5px;
}

.sheet-terrain {
    width: 120px;
    position: relative;
    top: 3px;
}

.sheet-applyModifier {
    position: relative;
    top: 5px;
}

.sheet-hidden {
    display: none;
}

.sheet-itemCount {
    position: relative;
    left: 38px;
}

.sheet-showDiv {
    display: none;
}

.sheet-showDiv:not(:checked) ~ div, fieldset {
    display: none !important;
}

.sheet-showDiv:checked ~ div, fieldset {
    display: inline;
}

.sheet-showFumble {
    display: none;
}

.sheet-showFumble:not(:checked) ~ label {
    display: none !important;
}

.sheet-showFumble:checked ~ label {
    display: inline;
}

span.sheet-overburdenPenalty {
    position: relative;
    top: 3px;
}

input.sheet-overburdenPenalty {
    position: relative;
    top: 1px
}

.sheet-bonusPenaltyPreferences {
    position: relative;
    bottom: 8px;
}

.sheet-checkLabel {
    position: relative;
    top: 10px;
}

.sheet-terrainLabel,
.sheet-weatherLabel {
    display: inline-block;
}

.sheet-notesToggle {
    position: relative;
    right: 21px;
    top: 10px;
    opacity: 0;
    z-index: 999;
}

.sheet-notesIcon {
    position: relative;
    color: var(--header-bg-color);
    top: 12px;
    font-size: 1.5em;
}

.sheet-notesArea {
    width: 500px;
    height: 75px;
}

.sheet-spellsLabel {
    margin: 10px 0;
}

.sheet-penaltyCondition {
    display: none;
}

.sheet-penaltyCondition:checked ~ input {
    border-color: #ff8888;
}

.sheet-diceAdjustment[value='increased'] ~ input{
    border: 1px solid limegreen;
}

.sheet-diceAdjustment[value='reduced'] ~ input{
    border: 1px solid #ff8888;
}

.sheet-deathCondition {
    display: none;
}

.sheet-deathCondition:checked ~ input {
    border-color: red;
}

.sheet-bonusCondition {
    display: none;
}

.sheet-bonusCondition:checked ~ input {
    border-color: green;
}

.sheet-inlineCheckbox {
    display: inline;
}

.sheet-headerLabel {
    width: 240px;
    height: 20px;
}

.sheet-headerLabel-eq {
    font-size: 13px;
    width: max-content;
    min-width: 240px;
}

.sheet-loweredHeaderLabel {
    margin-top: 15px;
}

.sheet-checkboxLabel {
    font-weight: bold;
    font-size: 12px;
    display: inline;
}

.sheet-weaponRow2 {
    position:relative;
    bottom: 4px;
}

.sheet-damage {
    position: relative;
    bottom: 6px;
}

.sheet-concentration {
    display: inline;
}

/* Weapon Mastery
    ============================= */
input.sheet-radioChoice {
    width: 130px;
    cursor: pointer;
    position: relative;
    opacity: 0;
    z-index: 9999;
    height: 18px;
}

span.sheet-radioChoice {
    text-align: center;
    display: inline-block;
    background: var(--unselected-item-bg-color);
    color: var(--unselected-item-text-color);
    border-radius: 4px;
    width: 130px;
    cursor: pointer;
    position: relative;
    margin-left: -133px;
    font-weight: bold;
    margin-bottom: 5px;
}

input.sheet-radioChoice1:checked + span.sheet-radioChoice1,
input.sheet-radioChoice2:checked + span.sheet-radioChoice2,
input.sheet-radioChoice3:checked + span.sheet-radioChoice3,
input.sheet-radioChoice4:checked + span.sheet-radioChoice4,
input.sheet-radioChoice5:checked + span.sheet-radioChoice5,
input.sheet-radioChoice6:checked + span.sheet-radioChoice6 {
    background: var(--selected-item-bg-color);
    color: var(--selected-item-text-color);
    border-radius: 4px;
    border: transparent;
}

.sheet-weaponBar {
    padding-left: 10px;
}

/* High Level Tabs
    ============================= */
input.sheet-tab {
    width: 140px;
    height: 40px;
    cursor: pointer;
    position: relative;
    opacity: 0;
    z-index: 9999;
}

span.sheet-tab {
    text-align: center;
    display: inline-block;
    font-size: 17px;
    background: var(--main-bg-color);
    color: var(--unselected-item-text-color);
    font-weight: bold;
    border-radius: 4px;
    width: 140px;
    height: 40px;
    cursor: pointer;
    position: relative;
    vertical-align: middle;
    margin-left: -144px;
    line-height: 40px;
    border: 1px solid var(--unselected-item-bg-color);
}

span.sheet-tab-demo {
    margin-left: 0;
    cursor: default;
    background: var(--selected-item-bg-color);
    color: var(--selected-item-text-color);
}

input.sheet-tab6 {
    width: 20px;
}

span.sheet-tab6 {
    font-family: "pictos";
    font-size: 10px;
    width: 20px;
    margin-left: 0;
    right: 25px;
}

input.sheet-tab1:checked + span.sheet-tab1,
input.sheet-tab2:checked + span.sheet-tab2,
input.sheet-tab3:checked + span.sheet-tab3,
input.sheet-tab4:checked + span.sheet-tab4,
input.sheet-tab5:checked + span.sheet-tab5,
input.sheet-tab6:checked + span.sheet-tab6 {
    background: var(--selected-item-bg-color);
    color: var(--selected-item-text-color);
    border-radius: 2px;
    border: transparent;
}

input.sheet-tab1:not(:checked) ~ span.sheet-characterDetails,
input.sheet-tab2:not(:checked) ~ span.sheet-characterClass,
input.sheet-tab3:not(:checked) ~ span.sheet-characterStats,
input.sheet-tab4:not(:checked) ~ span.sheet-characterChecks,
input.sheet-tab5:not(:checked) ~ span.sheet-characterEquipment,
input.sheet-tab6:not(:checked) ~ span.sheet-settingsTab {
    display: none;
}

input.sheet-tab1:checked ~ span.sheet-characterDetails,
input.sheet-tab2:checked ~ span.sheet-characterClass,
input.sheet-tab3:checked ~ span.sheet-characterStats,
input.sheet-tab4:checked ~ span.sheet-characterChecks,
input.sheet-tab5:checked ~ span.sheet-characterEquipment,
input.sheet-tab6:checked ~ span.sheet-settingsTab {
    display: block;
    background-color:var(--main-bg-color);
    padding: 5px;
}

/* Roll Templates
    ============================= */
.sheet-rolltemplate-skillCheck .sheet-rollTitle,
.sheet-rolltemplate-accuracyCheck .sheet-rollTitle,
.sheet-rolltemplate-oneDieCheck .sheet-rollTitle {
    color: white;
    padding: .6em 25px;
    font-size: 1.2em;
    margin-bottom: 3px;
    border-spacing: 0;
    text-align: center;
    background-image:
        url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Ryuutama/images/rollTitleBookendLeft.svg'),
        url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Ryuutama/images/rollTitleBookendRight.svg');
    background-position: top left, top right;
    background-repeat: repeat-y;
    min-height: 10px;
    background-size: 20px auto;
    font-family: 'Apple Chancery', 'Bellota', 'Palatino Linotype', cursive;
    font-weight: bold;
}

.sheet-rolltemplate-skillCheck .sheet-rollTitle,
.sheet-rolltemplate-oneDieCheck .sheet-rollTitle,
.sheet-rolltemplate-accuracyCheck .sheet-rollTitle {background-color:#aaa57c;}

.sheet-rolltemplate-skillCheck .sheet-rollTitle.sheet-Spring,
.sheet-rolltemplate-oneDieCheck .sheet-rollTitle.sheet-Spring,
.sheet-rolltemplate-accuracyCheck .sheet-rollTitle.sheet-Spring {background-color:#72aa75;}

.sheet-rolltemplate-skillCheck .sheet-rollTitle.sheet-Summer,
.sheet-rolltemplate-oneDieCheck .sheet-rollTitle.sheet-Summer,
.sheet-rolltemplate-accuracyCheck .sheet-rollTitle.sheet-Summer {background-color:#e0861b;}

.sheet-rolltemplate-skillCheck .sheet-rollTitle.sheet-Fall,
.sheet-rolltemplate-oneDieCheck .sheet-rollTitle.sheet-Fall,
.sheet-rolltemplate-accuracyCheck .sheet-rollTitle.sheet-Fall {background-color:#9e022b;}

.sheet-rolltemplate-skillCheck .sheet-rollTitle.sheet-Winter,
.sheet-rolltemplate-oneDieCheck .sheet-rollTitle.sheet-Winter,
.sheet-rolltemplate-accuracyCheck .sheet-rollTitle.sheet-Winter {background-color:#318baa;}

.sheet-rolltemplate-skillCheck .sheet-rollResult,
.sheet-rolltemplate-accuracyCheck .sheet-rollResult,
.sheet-rolltemplate-oneDieCheck .sheet-rollResult{
    margin: 1em;
    vertical-align: top;
    text-decoration: none;
    text-align: center;
}

.sheet-rolltemplate-skillCheck .sheet-critical,
.sheet-rolltemplate-accuracyCheck .sheet-critical {
    color:green;
    font-weight:bold;
    margin-top: 5px;
}

.sheet-rolltemplate-skillCheck .sheet-fumble,
.sheet-rolltemplate-accuracyCheck .sheet-fumble {
    color:red;
    font-weight:bold;
    margin-top: 5px;
}

.sheet-rolltemplate-skillCheck .sheet-container,
.sheet-rolltemplate-accuracyCheck .sheet-container,
.sheet-rolltemplate-oneDieCheck .sheet-container {
    background-color: #ffffff;
    border: 1px solid gray;
    border-radius: 3px;
    width: 98%;
    overflow: auto;
}

.sheet-rolltemplate-skillCheck .inlinerollresult,
.sheet-rolltemplate-accuracyCheck .inlinerollresult,
.sheet-rolltemplate-oneDieCheck .inlinerollresult {
    background-color: #fff;
    border: 2px solid #fff;
}

.sheet-rolltemplate-oneDieCheck .sheet-rollFreeText {
    margin-left: 5px;
}

.sheet-rolltemplate-spellContainer {
    border: 1px solid gray;
    border-radius: 3px;
    width: 98%;
}

.sheet-rolltemplate-spellCard {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    background-color: #d0d2e4;
}

.sheet-rolltemplate-spellTitle,
.sheet-rolltemplate-spellAttrText{
    background-color: #45619e;
    font-family: Helvetica, Arial;
    font-weight: bold;
    font-size: 12px;
    justify-content: center;
    color: white;
    padding: 1px 3px;
}

.sheet-rolltemplate-spellAttrText a[href^="!"],
.sheet-rolltemplate-spellAttrText a[href^="~"] {
    background: none;
    color: #000;
    border: none;
    padding: 0;
    font-weight: bold;
}

.sheet-rolltemplate-spellAttr {
    flex: 1;
}

.sheet-rolltemplate-spellAttrText,
.sheet-rolltemplate-spellEffect {
    background-color: #d0d2e4;
    color: black;
    font-weight: normal;
}

.sheet-rolltemplate-spellEffect {
    background-color: #fff;
    padding: 3px;
}

/* Styling that removes the box around roll buttons
    ============================= */
button[type=roll].sheet-skill-check-button::before { content: ''; }

button[type=roll].sheet-skill-check-button:hover {
    color: var(--selected-item-bg-color);
    text-shadow: 0 1px 0 var(--unselected-item-bg-color);
}

button[type=roll].sheet-skill-check-button {
    background-color: transparent;
    font-size: 1em;
    color: var(--main-text-color);
    background-image: none;
    text-shadow: none;
    box-shadow: none;
    border: none;
    padding: 0px;
    margin: 0px;
    height: auto;
}

/* Repeating Config buttons
    ============================= */

.sheet-config-toggles {
    font-family: "pictos";
    position: relative;
    cursor: pointer;
    opacity: 0.5;
    float: right;
}

span.sheet-config-toggles {
    bottom: 20px;
}

input.sheet-config-checkbox {
    opacity: 0;
    z-index: 2;
    bottom: 17px;
}

.sheet-settings-toggle {
    right: -12px;
}

input.sheet-collapse-toggle {
    right: -11px;
}

span.sheet-collapse-toggle {
    right: -25px;
}

input.sheet-config-toggles:not(:checked) + span {
    opacity: 1;
}

input[name='attr_collapse']:checked ~ hr,
input[name='attr_collapse']:checked ~ div.sheet-collapse,
input[name='attr_settings']:checked ~ div.sheet-settings {
    display: none;
}

div.sheet-collapse,
div.sheet-settings {
    display: flex;
}

.sheet-add-skill-checkbox {
    position: absolute;
    right: 0px;
    top: 5px;
}

.sheet-add-skill-icon {
    right: -3px;
    top: 2px;
}

/* Spell repeating section
    ============================= */


.sheet-spell-details {
    display: grid;
    grid-template-columns: minmax(200px,25%) minmax(50px,5%) minmax(100px,10%) minmax(200px,50%) minmax(120px,15%) minmax(105px,10%);
    grid-template-rows: 1fr;
    text-align: left;
    width: 90%;
    height: 20px;
}

.sheet-spellName     { grid-area: 1 / 1 / 2 / 2; text-align: left;}
.sheet-spellCost     { grid-area: 1 / 2 / 2 / 3; }
.sheet-spellDuration { grid-area: 1 / 3 / 2 / 4; }
.sheet-spellTarget   { grid-area: 1 / 4 / 2 / 5; }
.sheet-spellRange    { grid-area: 1 / 5 / 2 / 6; }
.sheet-spellTypes    { grid-area: 1 / 6 / 2 / 7; }

.sheet-spellWrap {
    white-space: normal;
    width: 100%;
    word-break: break-all;
}

.repcontainer[data-groupname='repeating_spells'] {
    padding-bottom: 20px;
}

/* Journey Rules
============================= */

.sheet-journeyRulesGrid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    justify-items: center;
}

.sheet-journeyRulesTitle { grid-area: 1 / 1 / 2 / 4; }
.sheet-journeyRulesTravelCheck { grid-area: 2 / 1 / 4 / 2; }
.sheet-journeyRulesDirectionCheck { grid-area: 2 / 2 / 4 / 3; }
.sheet-journeyRulesCampCheck { grid-area: 2 / 3 / 4 / 4; }

/* NPC checkbox functionality
    ============================= */
.sheet-block-switch {
    float: right;
    overflow: auto;
    margin: 0;
    padding: 0;
    max-width: 40px;
    text-align-last: center;
    border: none;
    border-bottom: 1px solid gray;
    border-radius: 0;
}

.sheet-hidden {
    display: none;
}

.sheet-hider:not(:checked) + div {
    display: none;
}


/* NPC Sheet styling
    ============================= */
.sheet-npc-sheet-container * {
    font-family: Helvetica, sans-serif;
    font-weight: bold;
    font-size: 12px;
    background-color: #ffffff;
}

.sheet-npc-sheet-container table {
    width: 100%;
}

.sheet-npc-sheet-container td {
    padding: 1px 10px;
}

.sheet-npc-sheet-container td::first-letter {
    font-size: 125%;
}

.sheet-npc-sheet-container input[type=text],
.sheet-npc-sheet-container label {
    background-color:rgba(0, 0, 0, 0);
    -webkit-appearance: none;
    transition:height 1s;
    display: inline;
    border: none;
    outline:none;
}

.sheet-npc-sheet-container input[type=number],
.sheet-npc-sheet-container select {
    -moz-appearance:textfield; /* Firefox */
    background-color: white;
    text-align: center;
    vertical-align: middle;
    border:  none;
    outline: none;
}

.sheet-npc-sheet-container
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

td.sheet-npc-name {
    width: 100%;
    padding: 0;
}

input.sheet-npc-name {
    text-transform: uppercase;
    font-size: 20px;
    color: #485A7F;
    width: 100%;
    max-width: unset;
}

.sheet-npc-level-label {
    font-family: Helvetica, sans-serif;
    background-color: #EB6481;
    text-align: center;
    font-size: 10px;
    color: white;
    width: 7%;
}

.sheet-npc-level-input {
    background-color: #F1DCDA;
    width: 10%;
}

.sheet-npc-table-section-top-left {
    background-color: #E0C2DB;
    width: 25%;
}

.sheet-npc-table-section-top-right {
    background-color: #F7FAE5;
    padding-right: 0;
    margin-right: 0;
    width: 75%;
}

.sheet-npc-table-section-bottom-a {
    background-color: #F4878A;
    width: 20%;
}

.sheet-npc-table-section-bottom-b {
    background-color: #FDEDEE;
    width: 20%;
}

.sheet-npc-table-section-bottom-c {
    background-color: #92C9CE;
    width: 20%;
}

.sheet-npc-table-section-bottom-d {
    background-color: #E7EFF1;
    width: 40%;
}

.sheet-add-crit-die {
    font-size: xx-small;
    background-color: #E7EFF1;
}

.sheet-npc-details {
    width: 99%;
}

.sheet-npc-always-whisper-roll {
    position: absolute;
    right: 0px;
}

/* GM Sheet styling
    ============================= */
.sheet-gm-sheet-container {
    padding: 10px;
}

input.sheet-gmtab1:checked + .sheet-gmtab1,
input.sheet-gmtab2:checked + .sheet-gmtab2 {
    background: var(--selected-item-bg-color);
    color: var(--selected-item-text-color);
    border-radius: 2px;
    border: transparent;
}

input.sheet-gmtab1:not(:checked) ~ span.sheet-gmCharacterDetails,
input.sheet-gmtab2:not(:checked) ~ span.sheet-gmHistory {
    display: none;
}

input.sheet-gmtab1:checked ~ span.sheet-gmCharacterDetails,
input.sheet-gmtab2:checked ~ span.sheet-gmHistory {
    display: block;
    background-color:var(--main-bg-color);
    padding: 5px;
}

.sheet-gmpc-label {
    margin: 10px 0 0 0;
    width: 98%;
}

.sheet-lp {
    padding-right: 49px;
}

.sheet-gmpcLifepoints {
    justify-content: flex-start;
    align-items: center;
}

.sheet-lifepointsHeader {
    width: 207px;
}

.sheet-gmpc-repeatingName {
    font-size: 1.1em;
    font-weight: normal;
    cursor: pointer;
    margin-top: 5px;
    position: relative;
    right: 20px;
}

.sheet-gmpc-repeatingLabel {
    margin-top: 5px;
    margin-bottom: 0;
}

.sheet-gmpcNameInput {
    width: 300px;
}

.sheet-benedictionUsed {
    opacity: 0;
}

input.sheet-benedictionUsed:checked + span.sheet-gmpc-repeatingName {
    text-decoration: line-through;
    opacity: .5;
}

.sheet-reveilName {
    display: inline-block;
    min-width: 50%;
    max-width: 50%;
    font-size: 1.2em;
    margin-top: 5px;
}

.sheet-protectedTravelers {
    height: 75px;
}

.sheet-historyTales {
    display: grid;
    grid-template-columns: 40% 15% 45%;
    grid-template-rows: 1fr;
}

.sheet-scenarioName { grid-area: 1 / 1 / 2 / 2; }
.sheet-scenarioDate  { grid-area: 1 / 2 / 2 / 3; }
.sheet-scenarioTravelers { grid-area: 1 / 3 / 2 / 4; }

input.sheet-historyInput {
    max-width: unset;
    width: 98%;
}

.repcontainer[data-groupname='repeating_reveils'],
.repcontainer[data-groupname='repeating_benedictions'] {
    padding-bottom: 20px;
}