/*-------------------------------------------*/
/*------------- SWD6 Main CSS----------------*/
/*-------------------------------------------*/
.charsheet {
    background-image: url(https://cdn.pixabay.com/photo/2015/09/29/15/12/stars-964022_960_720.png); /*black space with tiny white stars*/
    background-color: black;
    background-repeat: repeat;
    color:white;
}

.charsheet div.version-top{
    position: absolute;
    right: 5px;
    top: 30px;
}

.charsheet div.logo{
    display: inline-block;
    position: absolute;
    left: 150px;
    padding-bottom: 50px;
}
.charsheet img.logo{
    max-height: 80px;
}

.charsheet :is(label, h1, h2, h3, h4, h5){
    color:white;
}

.charsheet table{
    border-collapse:separate;
    border-spacing:4px;
}

.charsheet textarea{
    resize:none;
}

.charsheet :is(p, .txtcenter){
    text-align: center;
}

.charsheet .toppad{
    padding:2px;
}

.charsheet .section{
    border-top: 5px dotted white;
    padding:10px;
    width: 100%;
}


.charsheet .flex-box{
    display: flex;
}
.charsheet .flex-col{
    flex: 1;
}


.charsheet input:not(:valid) {
    background-color: #ffcccb;
}

.charsheet input[type=number].p60{
    width: 60px;
    text-align: center;
    padding-top:2px;
    padding-bottom:2px;
    display: inline-block;
    float:right;
}

.charsheet .p90{
    width: 90px;
}

.charsheet input[type=number].mediumnumber{
    width:60px;
}

.charsheet input[type=number].credits,
.charsheet span.credits {
    width: 80px;
    padding-top: 2px;
    padding-bottom: 2px;
    text-align: center;
}
.charsheet input[type=number].totalcredits{
    width: 60%;
    float: right;
}


.charsheet input[type=text].smalltext{
    width:60px;
    margin:0;
}

.charsheet input[type=text].mediumtext{
    width:80px;
    margin:0;
}

.charsheet input[type=text].reduce-padd{
    padding-top:2px;
    padding-bottom:2px;
}

.charsheet input[type=text].skilltext{
    width:115px;
    padding:2px;
    margin-left:3px;
}

.charsheet .right{
    float:right;
}

.charsheet .left{
    float:left;
}

.charsheet .bold{
    font-size: 12pt;
    margin-bottom: 10px;
}

.charsheet span.num {
    background: white;
    color: black;
    border-radius: 2px;
    padding: 4px;
    margin: 5px;
    height: 28px;
    width: 50px;
}


.charsheet .tdborder{
    border: 2px solid white;
    vertical-align:top;
    padding:5px;
    margin: 5px;
}

.charsheet .rightmargin{
    margin-right:0;
}

.charsheet select.smallselect{
    width:60px;
    height:25px;
    padding-top:2px;
    padding-bottom:2px;
    margin:0;
    display: inline-block;
    float:right;
    text-align: center;
}

.charsheet select.mediumselect{ /*Used for Wound levels dropdown select*/
    width:100px;
    height:25px;
    padding-top:2px;
    padding-bottom:2px;
    margin:0;
    display: inline-block;
    float:right;
}

.charsheet label.areaLabel{
    margin:0;
}

.charsheet input[type="text"].60p{
    width: 60%;
}

.charsheet .lineblck{
    display:inline-block;
}

/*-----------------------------------------*/
/*----------Roll Buttons classes-----------*/

.charsheet button[type=roll].d6-dice::before {    /*new die changes die roller to d6*/
    font-family: 'dicefontd6', arial, sans-serif;
    content: 'F ';
    color: red;
}

.charsheet .forcebutton{
    width:90px;
    padding-right:5px;
}

.charsheet .redtxt{
    font-size: 8px;
    color: red;
    font-family: 'Arial', sans-serif;
}


/* writing the letter 't' with this font shows an impact icon signifying physical damage */
.charsheet button.physical{
    font-family: 'Pictos Custom';
}
/* writing the letter 'e' with this font shows e bolt icon signifying energy damage */
.charsheet button.energy{
    font-family: 'Pictos';
}

.charsheet span.physical{
    font-family: 'Pictos Custom';
    font-size: large;
    content: 't';
}
/* writing the letter 'e' with this font shows e bolt icon signifying energy damage */
.charsheet span.energy{
    font-family: 'Pictos';
    font-size: large;
    content: 'e';
}

/*-------------------------------------------*/
/*-----Main Settings and hide classes--------*/
/*-----------(from GUMSHOE Official)---------*/
.charsheet .main-settings .container{
    width: 850px;
}
.charsheet .main-settings .input-row label {
    display: inline-block;
    width: auto;
}

.charsheet .main-settings .input-row input {
    margin-right: 30px;
}

.charsheet .main-settings .input-row select {
    width: 45%;
    margin-right: 15px;
}

.charsheet input.main-options.options-flag + span,/*displays the cog icon*/
.charsheet input[type=radio]:checked ~ .master-container input.options-flag + span {
    font-family: pictos;
    font-style: normal;
}

.charsheet div.main-settings {
    display: none;
    position: relative;
    margin-left: 0;
}

.charsheet input.options-flag:checked ~ div.main-settings {
    display: inline-block;
    width: 600px;
    height: 500px;
}

.charsheet input.selector-switch ,
.charsheet input.options-flag:checked ~ div.main-container {
    display: none;
}

/* all hide options using option menu checkboxes*/

.charsheet .master-container :is(.pc, .npc, .ship, .shop-inventory) {
    display: none;
}

.charsheet input.toggle[value="0"] ~ .master-container .pc,
.charsheet input.toggle[value="1"] ~ .master-container .npc,
.charsheet input.toggle[value="2"] ~ .master-container .ship,
.charsheet input.toggle[value="3"] ~ .master-container .shop-inventory {
    display: block;
}

.charsheet input.toggle[value="2"] ~ .master-container .ship.shipblock{
    display: grid;
}
.charsheet input.toggle[value="2"] ~ .master-container .ship.shipheader{
    display: flex;
}

.charsheet input.background:checked  ~ .master-container .background-hide,
.charsheet input.force:checked ~ .master-container .force-hide,
.charsheet input.equipment:checked ~ .master-container .equipment-hide,
.charsheet input.gmroll:checked ~ .master-container .gmroll-hide,
.charsheet input.rollmod:checked ~ .master-container .rollmod,
.charsheet input.rollmod:not(:checked) ~ .master-container .rollmod-no,
.charsheet input.cptracker:checked ~ .master-container .cptracker-hide,
.charsheet input.credittracker:checked ~ .master-container .credittracker-hide  {
    display: none;
}

/*-------------------------------------------*/
/*------------- General Styles---------------*/
/*------------(from GUMSHOE Official)--------*/

.charsheet input[type=number].txtfield::-webkit-inner-spin-button,
.charsheet input[type=number].txtfield::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.charsheet input[type=number].txtfield {
  -moz-appearance: textfield;
}

.charsheet .master-container {
    position: relative;
    padding: 0;
    display: inline-block;
    background-image: url(https://cdn.pixabay.com/photo/2015/09/29/15/12/stars-964022_960_720.png); /*black space with tiny stars*/
    background-color: black;
    background-repeat: repeat;
    width: 860px;
    top: -10px;
}

.charsheet .container {
    padding: 5px;
    margin-left: -25px;
    position: relative;
}

.charsheet .main-container {
    display: inline-block;
    padding-top: 75px;
    margin-left: 0;
}

.charsheet div.footer{
    text-align: center;
    padding-top:10px;
}

/*-------------------------------------------*/
/*------------- Options Toggles--------------*/
/*-----------(from GUMSHOE Official)---------*/

.charsheet input.options-flag,
.charsheet input.options-flag + span {
    position: absolute;
    top: 2px;
    right: 2px;
    width: 15px;
    height: 15px;
}

.charsheet input.options-flag {
    z-index: 99;
    opacity: 0;
}

.charsheet input.options-flag + span {
    margin-top: 0;
    display: none;
    white-space: nowrap;
    line-height: 15px;
    font-size: 17px;
    color: white;
    cursor: pointer;
}

.charsheet input.options-flag.main-options {
    width: 30px;
    height: 30px;
    top: 20px;
    left: 20px;
    z-index: 3;
}

.charsheet input.options-flag.main-options + span {
    width: 30px;
    height: 30px;
    top: 20px;
    left: 20px;
    font-size: 34px;
    z-index: 2;
    line-height: 30px;
    opacity: .5;
    display: block;
}

.charsheet input.options-flag.main-options:hover + span {
    opacity: 1;
}

.charsheet input.options-flag:checked + span {
    color: white;
    display: block;
}

.charsheet input.selector-switch:checked ~ .master-container .content .options,
.charsheet input.selector-switch:checked ~ .master-container .content .options-flag:checked ~ .display  {
    display: none;
}

.charsheet input.selector-switch:checked ~ .master-container .content .options-flag:checked ~ .options {
    display: block;
}

.charsheet div.sheettype-title{
    position:absolute;
    right: 5px;
    top:-35px;
}
/*-------------------------------------------*/
/*--------------- PC Section-----------------*/

.charsheet .physical-params {
    display: flex;
    margin-top: 25px;
}

.charsheet .physical-params label {
    text-align: center;
}

.charsheet .physical-params input {
    display: block;
    width: 100% !important;
    text-align: center;
}

.charsheet .custom-roll-table {
    display: table;
    width: 100%;
}

.charsheet .custom-roll-table button.d6-dice {
    width: 35px;
    height: 18px;
}
.charsheet textarea.description{
    height:6em;
    width:97%
}
.charsheet textarea.description-phys{
    height: 6em;
    width: 97%;
    margin-top: 3px;
}
.charsheet textarea.specabilities{
    width: 95%;
    height: 12em;
}

.charsheet th.init{
    vertical-align: top;
}
.charsheet td.init{
    padding-left: 6px;
    padding-bottom: 40px;
}
.charsheet label input[type="number"].init,
.charsheet input[type="number"].init{
    width: 33px;
}

/*-------------------------------------------*/
/*--------------- NPC Section-----------------*/
.charsheet div.section.npc div.first-col{
    display: inline-block;
}
.charsheet div.section.npc .npcname{
    width: 65%;
}
.charsheet label.wound{
    text-decoration: underline;
}
.charsheet select.wound{
    width: 125px;
}

/* Attributes */
.charsheet .attributes {
    border: 2px solid white;
    margin: 5px;
    padding: 10px;
}

.charsheet .attribute {
    display: flex;
    margin-bottom: 5px;
}

/* Unified Dice */
.charsheet .unified-dice {
    width: 32px;
    height: 34px;
    line-height: 34px;
}
.charsheet .unified-dice-text {
    flex-grow: 1;
    height: 40px;
    margin: 0;
    padding: 0 5px;
    font-size: 20px;
    vertical-align: top;
    line-height: 40px;
}

.charsheet .unified-dice-roll {
}

.charsheet button[type=roll].unified-dice-roll {
    margin: 0;
}

.charsheet input[type="number"].unified-dice-input {
    font-size: large;
    font-weight: bold;
    text-align: center;
    width: 46px;
    padding: 2px 4px;
}

.charsheet .unified-dice-middle {
    display: inline-flex;
    width: 32px;
    height: 40px;
    padding: 0 2px;
    line-height: 40px;
    font-size: 1.6em;
    vertical-align: top;
    font-weight: bold;
}

.charsheet input[type="number"].unified-dice-pip {
    font-size: large;
    font-weight: bold;
    text-align: center;
    width: 46px;
    padding: 2px 4px;
}

.charsheet .attributes button[type=roll].unified-dice-roll {
    margin: 0 5px 0 0;
}

/* Skill */
.charsheet .skill {
    display: flex;
    height: 28px;
    margin: 4px 0;
}
.charsheet .skill * {
    height: 28px;
    line-height: 26px;
}
.charsheet .skill input[type="text"]{
    flex-grow: 1;
    width: inherit;
    margin-right: 5px;
}

.charsheet .skill label {
    padding: 0 1px;
}

.charsheet .skill .unified-dice-text {
    display: inline-flex;
    width: calc(100% - 223px);
    height: 28px;
    font-size: medium;
    font-weight: normal;
    vertical-align: top;
    line-height: 28px;
}

.charsheet .skill button[type=roll].unified-dice-roll {
    width: 32px;
    height: 24px;
    padding-top: 0;
}

.charsheet .skill input[type="number"].unified-dice-input {
    width: 46px;
    height: 28px;
    font-size: inherit;
    text-align: center;
}

.charsheet .skill .unified-dice-middle {
    display: inline-flex;
    width: 25px;
    height: 28px;
    margin: 0 2px;
    padding-left: 4px;
    padding-right: 3px;
    font-size: medium;
    vertical-align: top;
    line-height: 28px;
}

.charsheet .repcontrol {
    height: 28px;
    margin-top: 10px;
}

.charsheet .skill input[type="number"].unified-dice-pip {
    display: inline-flex;
    width: 46px;
    height: 28px;
    font-size: inherit;
    text-align: center;
}


.charsheet .redtxt {
    bottom: -3px;
    right: 5px;
}


/* Edit Mode */
.charsheet .editmode .skill {
    margin: 4px 36px 4px 34px
}

.charsheet .editmode :is(.unified-dice-roll, .unified-dice-input, .unified-dice-middle, .unified-dice-pip) {
    display: none !important;
}

.charsheet .editmode .unified-dice-text {
    width: 100% !important;
}
.charsheet .editmode .armor.sheet-row:not(:first-of-type) .cell:not(:first-of-type),
.charsheet .editmode .weapon.sheet-row:not(:first-of-type) .cell:not(:first-of-type) {
    display: none;
}
.charsheet .editmode .armor.sheet-row:not(:first-of-type) .cell:first-of-type,
.charsheet .editmode .weapon.sheet-row:not(:first-of-type) .cell:first-of-type {
    width: 100%;
}
.charsheet .force .editmode .skill input[type=checkbox] {
    display: none;
}


.charsheet .overflow-auto {
    overflow: auto;
    padding-top: 15px;
    padding-bottom: 10px;
}

/* Weapons & Armors */
.charsheet .armor.sheet-row,
.charsheet .weapon.sheet-row {
    display: flex;
    width: 100%;
}
.charsheet :not(input.gmroll:checked) .weapon.sheet-row ,
.charsheet :not(input.gmroll:checked) .armor.sheet-row {
    width: 866px;
}
.charsheet .armor.sheet-row:first-of-type .cell,
.charsheet .weapon.sheet-row:first-of-type .cell {
    height: 36px;
    border-bottom: 5px solid white;
}
.charsheet .armor.sheet-row:first-of-type .cell-4,
.charsheet .weapon.sheet-row:first-of-type .cell-4 {
    vertical-align: bottom;
}
.charsheet .cell {
    display: inline-block;
    margin: 0 4px;
    text-align: center;
}
.charsheet .cell:first-of-type {
    margin-left: 0;
}
.charsheet .cell:last-of-type {
    margin-right: 0;
}
.charsheet .armor.sheet-row:first-of-type .cell,
.charsheet .weapon.sheet-row:first-of-type .cell {
    vertical-align: top;
    line-height: 36px;
    font-weight: bold;
}
.charsheet .weapon.sheet-row:first-of-type .cell.cell-4 {
    line-height: inherit;
}
.charsheet .cell-name {
    min-width: 50px;
    flex-grow: 1;
}
.charsheet .cell-name .unified-dice-text {
    width: 100%;
}
.charsheet .cell-dice {
    width: 205px;
}
.charsheet :not(input.gmroll:checked) .cell-dice {
    width: 208px;
}
.charsheet .cell-1 {
    width: 46px;
}
.charsheet .cell-2 {
    width: 98px;
}
.charsheet :not(input.gmroll:checked) .cell-2 {
    width: 92px;
}
.charsheet .cell-4 {
    width: 210px;
}
.charsheet .cell-4 .part {
    display: inline-block;
    width: 46px;
}
.charsheet .cell-5 {
    width: 219px;
}

.charsheet .repcontainer[data-groupname="repeating_weapons"] > .repitem input[type="text"].name,
.charsheet .repcontainer[data-groupname="repeating_armors"] > .repitem input[type="text"].name{
    width: 98px;
}
.charsheet .repcontainer[data-groupname="repeating_weapons"] > .repitem input[type="number"].40px,
.charsheet .repcontainer[data-groupname="repeating_armors"] > .repitem input[type="number"].40px{
    width: 40px;
}

/* Force */
.charsheet .force .skill .unified-dice-text {
    width: calc(100% - 139px);
}

.charsheet .force .skill input[type=checkbox],
.charsheet .powers input[type=checkbox] {
    display: inline-block;
    height: 28px;
    width: 44px;
}
.charsheet .force-powers-description {
    width: 100%;
    height: 14em;
    resize: vertical;
}
.charsheet table.powers {
    width: 100%;
}
.charsheet table.powers td {
    text-align: end;
}
.charsheet .force-hide .weapon.sheet-row {
    width: 100%;
}
.charsheet :not(input.gmroll:checked) .force-hide .weapon.sheet-row {
    width: 100%;
}
.charsheet .force-hide .weapon .cell.cell-name {
    width: calc(100% - 418px);
}


/* Equipment  & Backgorund */

.charsheet div.section.equipment-hide textarea{
    height: 7em;
    width: 96%;
}

.charsheet div.section.backgorund-hide td.33p{
    width: 33.33%;
}


/* Char point  & credit tracking */


.charsheet .repcontainer[data-groupname="repeating_cptable"] > .repitem div,
.charsheet .repcontainer[data-groupname="repeating_credittable"] > .repitem div{
    padding-top: 8px;
}
.charsheet .repcontainer[data-groupname="repeating_cptable"] > .repitem input[type="text"],
.charsheet .repcontainer[data-groupname="repeating_credittable"] > .repitem input[type="text"]{
    width:80%;
}
.charsheet .repcontainer[data-groupname="repeating_credittable"] > .repitem input[type="number"]{
    width:100px;
}

/*-------------------------------------------*/
/*------------- Ship Section-----------------*/

.charsheet .shipinfo span {
    display: inline-block;
    margin: 5px 10px 5px 10px;
}

.charsheet div.ship .wborder{
    border: 2px solid white;
    padding: 5px;
}

.charsheet div.shipheader{
    display: flex;
    justify-content: center;
    flex-flow: row nowrap;
}

.charsheet div.shipheader span:nth-child(1) input[type="text"]{
    width: 300px;
}
.charsheet div.shipheader span:nth-child(2) input[type="text"],
.charsheet div.shipheader span:nth-child(3) input[type="text"]{
    width: 150px;
}

.charsheet div.shipblock{
    padding: 5px;
    display: grid;
    grid-template-columns: 3fr 7fr;
    grid-template-areas: "price   perf      "
                         "price   sensor    "
                         "price   sensor    "
                         "price   hyperdrive"
                         "consume hyperdrive"
                         "consume dura      ";
}

.charsheet div.shipblock div.price{
    grid-area: price;
    flex-flow: column nowrap;
    justify-content: space-between;
}

.charsheet div.shipblock div.price span{
    width: 100px;
}

.charsheet div.shipblock div.price div{
    display: flex;
    flex-flow: column nowrap;
    justify-content: space-between;
}

.charsheet div.shipblock div.priceblock div.flex-row{
    flex-flow: row nowrap;
    justify-content: space-around;
    margin: 3px;
}


/* Performance */
.charsheet div.shipblock div.perf{
    grid-area: perf;
    padding: 5px;
}

.charsheet div.shipblock div.perf .medium,
.charsheet div.shipblock div.sensor .medium,
.charsheet div.shipblock div.hyperdrive input[type="text"],
.charsheet div.shipblock div.price input[type="text"],
{
    width: 80px;
}

.charsheet div.shipblock div.perf label:not(.title){
    font-size: 0.8em;
}

.charsheet div.shipblock div.perf div.perf,
.charsheet div.shipblock div.perf-block div.flex-col{
    display: flex;
    flex-flow: column nowrap;
    border-width: 3px 0 0 0;
    border-style: solid;
    border-color: transparent;
    padding-top: 5px;
}
.charsheet div.shipblock div.perf div.perf-block{
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    padding: 5px;
}
.charsheet div.shipblock div.perf-block div.flex-col.wborder {
    border-width: 3px;
    border-color: white;
}

/* Sensors */
.charsheet div.shipblock div.sensor{
    grid-area: sensor;
    border: 2px solid white;
}

.charsheet div.shipblock div.sensor div.flex-row{
    display: flex;
    flex-flow: row nowrap;
}


.charsheet div.shipblock div.sensor div.grid{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(3, 1fr);
    border: 2px solid white;
    padding: 5px;
    width: 400px;
}

/* Hyperdrive */
.charsheet div.shipblock div.hyperdrive{
    grid-area: hyperdrive;
    display: flex;
    flex-flow: column nowrap;
}

.charsheet div.shipblock div.hyperdrive div{
    display: flex;
    flex-flow: row nowrap;
    font-size: 0.8em;
}

.charsheet div.shipblock div.hyperdrive .crew{
    display: flex;
    flex-flow: column nowrap;
}

.charsheet div.shipblock div.hyperdrive .hyper-grid{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(4, 1fr);
    border: 2px solid white;
    padding: 5px;
    width: 440px;
}

.charsheet div.shipblock div.hyper-grid label{
    width: 110px;
}

.charsheet div.shipblock div.hyperdrive input[type="text"]{
    height: 22px;
}


.charsheet div.shipblock div.consume{
    grid-area: consume;
}

.charsheet div.shipblock div.dura{
    grid-area: dura;
    display: grid;
    grid-template-rows: 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
}

.charsheet div.shipblock div.dura label{
    width:80px;
}

.charsheet div.section.ship div.other{
    margin-bottom: 10px;
}

/* Ship Weapons */

.charsheet .repcontainer[data-groupname="repeating_shipweapon"] > .repitem {
    border: 2px solid white;
    margin-bottom: 5px;
    padding: 5px;

    display: grid;
    grid-template-areas: "label value";
    grid-template-columns: 1fr 3fr
}

.charsheet .repcontainer[data-groupname="repeating_shipweapon"] > .repitem .range {
    display: inline-block;
    width: 60px;
    text-align: center;
    border: none;
}
.charsheet .repcontainer[data-groupname="repeating_shipweapon"] > .repitem div{
    margin-bottom:10px;
}
.charsheet .repcontainer[data-groupname="repeating_shipweapon"] > .repitem span.range{
    margin-left: 15px;
}

/* Generic Ship & Vehicle section */

.charsheet div.section.ship label{
    padding-top: 4px;
    padding-bottom: 4px;

}
.charsheet div.section.ship input[type="text"]{
    width: 95%;
    padding-bottom:8px;
}
.charsheet div.section.ship textarea{
    width: 97%;
    height: 17em;
}

/* misc sheet styling */

.charsheet input[type=number].40px{
    width: 40px;
}



/*-------------------------------------------*/
/*------------- Roll Templates---------------*/


/* new */

/* Smaller margins - remove these if you want the huge default left margin */
.sheet-rolltemplate-swd6 {
  margin-left: -37px;
}
.withoutavatars .sheet-rolltemplate-swd6 {
  margin-left: -7px;
}

.sheet-rolltemplate-swd6 .sheet-container {
  border: 3px solid black;
  border-radius: 3px;
}

/* Header formatting - title and subtitle */
.sheet-rolltemplate-swd6 .sheet-header {
  background-color: var(--header-bg-color);
  color: var(--header-text-color);
  text-align: left;
  text-transform: capitalize;
  padding: 5px;
  border-bottom: 2px solid black;
}
.sheet-rolltemplate-swd6 .sheet-name {
  font-size:1.2em;
  font-weight: bold;
}

.sheet-rolltemplate-swd6 .sheet-subtitle {
  font-size:.9em;
}

/* example colors */
.sheet-rolltemplate-swd6 .sheet-container {
  /* this is the default color */
  --header-bg-color: #a83521;
  --header-text-color: #FFF;
}

/* alt template colors */
.sheet-rolltemplate-swd6 .sheet-container.sheet-color-green {
  --header-bg-color: #008000;
}
.sheet-rolltemplate-swd6 .sheet-container.sheet-color-red {
  --header-bg-color: rgba(204, 0, 0,1);
}
.sheet-rolltemplate-swd6 .sheet-container.sheet-color-black {
  --header-bg-color: #000;
}
.sheet-rolltemplate-swd6 .sheet-container.sheet-color-purple {
  --header-bg-color: rgba(112,32,130,1);
}
.sheet-rolltemplate-swd6 .sheet-container.sheet-color-white {
  --header-bg-color: #FFF;
  --header-text-color: #000;
}

/* Allprops part */
.sheet-rolltemplate-swd6 .sheet-content {
  display: grid;
  background: #FFF;
  /* Header formatting - modify the column layout below */
  grid-template-columns: auto auto;
  /* Line height to match default roll template */
  line-height:1.4em;
}
.sheet-rolltemplate-swd6 .sheet-content > div {
  padding: 5px;
}

/* Left column */
.sheet-rolltemplate-swd6 .sheet-content .sheet-key {
  font-weight: bold;
  padding-right: 10px;
  text-align: right;
}

/* Empty rule, use this if you want to change the right column 
.sheet-rolltemplate-swd6 .sheet-value {
}
*/

/* Make even-numbered rows grey */
.sheet-rolltemplate-swd6 .sheet-content :nth-child(4n+3),
.sheet-rolltemplate-swd6 .sheet-content :nth-child(4n) {
  background:#EEE;
}

/* Description field */
.sheet-rolltemplate-swd6 .sheet-desc {
  grid-column: span 2;
  padding: 5px;
  text-align: center;
}


/* old */

/* ----------- BLUE -----------*/
.sheet-rolltemplate-blue table {
 width:100%;
 background-color:white;
 border:1px solid rgba(51, 51, 255,1);
}
.sheet-rolltemplate-blue caption {
 background-color:rgba(51, 51, 255,1);
 color:white;
 font-family:"Helvetica Neue",Helvetica,sans-serif;
 font-weight:600;
 text-align:center;
 font-size:1.1em;
 padding:5px;
}
.sheet-rolltemplate-blue td {
 padding:5px;
 line-height:1.4em;
 vertical-align:top;
}
.sheet-rolltemplate-blue td:first-child {
 font-weight:bold;
 text-align:right;
 min-width:50px;
 padding-right:10px;
}
.sheet-rolltemplate-blue tr:nth-child(even) {
 background-color:#eee;
}
/* ----------- GREEN -----------*/
.sheet-rolltemplate-green table {
 width:100%;
 background-color:white;
 border:1px solid rgba(0, 153, 51,1);
}
.sheet-rolltemplate-green caption {
 background-color:rgba(0, 153, 51,1);
 color:white;
 font-family:"Helvetica Neue",Helvetica,sans-serif;
 font-weight:600;
 text-align:center;
 font-size:1.1em;
 padding:5px;
}
.sheet-rolltemplate-green td {
 padding:5px;
 line-height:1.4em;
 vertical-align:top;
}
.sheet-rolltemplate-green td:first-child {
 font-weight:bold;
 text-align:right;
 min-width:50px;
 padding-right:10px;
}
.sheet-rolltemplate-green tr:nth-child(even) {
 background-color:#eee;
}
/* ----------- RED -----------*/
.sheet-rolltemplate-red table {
 width:100%;
 background-color:white;
 border:1px solid rgba(204, 0, 0,1);
}
.sheet-rolltemplate-red caption {
 background-color:rgba(204, 0, 0,1);
 color:white;
 font-family:"Helvetica Neue",Helvetica,sans-serif;
 font-weight:600;
 text-align:center;
 font-size:1.1em;
 padding:5px;
}
.sheet-rolltemplate-red td {
 padding:5px;
 line-height:1.4em;
 vertical-align:top;
}
.sheet-rolltemplate-red td:first-child {
 font-weight:bold;
 text-align:right;
 min-width:50px;
 padding-right:10px;
}
.sheet-rolltemplate-red tr:nth-child(even) {
 background-color:#eee;;
}
/* ----------- BLACK -----------*/
.sheet-rolltemplate-black table {
 width:100%;
 background-color:white;
 border:1px solid rgba(0, 0, 0,1);
}
.sheet-rolltemplate-black caption {
 background-color:rgba(0, 0, 0,1);
 color:white;
 font-family:"Helvetica Neue",Helvetica,sans-serif;
 font-weight:600;
 text-align:center;
 font-size:1.1em;
 padding:5px;
}
.sheet-rolltemplate-black td {
 padding:5px;
 line-height:1.4em;
 vertical-align:top;
}
.sheet-rolltemplate-black td:first-child {
 font-weight:bold;
 text-align:right;
 min-width:50px;
 padding-right:10px;
}
.sheet-rolltemplate-black tr:nth-child(even) {
 background-color:#eee;
}