diff --git a/Chaos 6010/Chaos 6010.css b/Chaos 6010/Chaos 6010.css
index c3df54b169..56f2415324 100644
--- a/Chaos 6010/Chaos 6010.css
+++ b/Chaos 6010/Chaos 6010.css
@@ -1,46 +1,1054 @@
-.charsheet label {
- display: inline-block;
- width: 75px;
- text-align: left;
- font-size: 1.1em;
-/* display: inline-block;
- width: 75px;
- text-align: right */
-}
+/* ************************************************************************************************************************************************ */
+/* Colours */
+/* ************************************************************************************************************************************************ */
+/*
+#604706 - input placeholders
+#916a08 (darker goldenrod) - text, placeholders
+DarkGoldenRod - header 2, table headers
+GoldenRod - table inputs, total fields
-.charsheet input {
- display: inline-block;
- /* width: 165px; */
- width: 110px;
-}
+#660000 - table borders
+#b30000 (lighter/brighter darkred) - buttons, total fields
+#e60000 (slightly lighter/brighter darkred) active inputs
+#ff1a1a -heading 3, active tabs and menu items
-.sheet-col strong.sheet-dee {
- font-size: 1.4em;
- font-weight: bold;
- padding-right: 4px;
-}
+#141414D9 (dark grey, 85% opacity) - backgrounds of table cells that aren't active inputs
+#080808 (very dark grey) - active input backgrounds
+#222222 (slightly lighter grey) - h1 background, button backgrounds
+*/
-.charsheet input.sheet-short {
- width: 3.5em;
-}
+
+/* ************************************************************************************************************************************************ */
+/* Whole Sheet */
+/* ************************************************************************************************************************************************ */
.charsheet {
- /*background-image: url("http://freeseamlesstextures.com/images/28-faded-parchment-background-sml.jpg");*/
- /* background-image: url("https://i.imgur.com/TG4tbXK.gif"); */
- background-image: url("https://i.imgur.com/qTDf1mU.gif");
- background-repeat: repeat-y;
-
-
-
+ background: url("https://cdn.discordapp.com/attachments/645700678907330560/926168705115754566/102743921_small.jpg") repeat;
+ color: #916a08;
}
-.charsheet table td, .charsheet table th {
- font-size: 1.1em;
- font-weight: bold;
- text-align: left;
+.sheet-demon-gate-charsheet {
+ min-height: 750px;
}
-select.sheet-dtype {
- width: 60px;
- vertical-align: top;
-}
\ No newline at end of file
+.sheet-background-flex-layout {
+ display: flex;
+ justify-content: space-between;
+ flex-wrap: nowrap;
+}
+
+.sheet-background-column-fixed-left,
+.sheet-background-column-fixed-right {
+ flex-grow: 0;
+ margin-left: 10px;
+ margin-right: 10px;
+ width: 10px;
+ min-width: 10px;
+ max-width: 10px;
+}
+
+.sheet-background-column-fixed-left {
+ margin-left: 5px;
+ margin-right: 15px;
+}
+
+.sheet-background-column-fixed-right {
+ margin-left: 15px;
+ margin-right: 5px;
+}
+
+.sheet-background-column-grow {
+ flex-grow: 1;
+ margin: 0;
+}
+
+
+/* ************************************************************************************************************************************************ */
+/* Tab buttons */
+/* ************************************************************************************************************************************************ */
+
+input.sheet-tab,
+span.sheet-tab {
+ margin-top: 10px;
+}
+
+.sheet-demon-gate-charsheet input.sheet-tab {
+ width: 94px;
+ height: 32px;
+ cursor: pointer;
+ position: relative;
+ opacity: 0;
+ z-index: 9999;
+ margin-left: 10px;
+}
+
+span.sheet-tab {
+ text-align: center;
+ display: inline-block;
+ font-size: 14px;
+ line-height: 28px;
+ border: 2px solid #e60000;
+ border-radius: 4px;
+ color: #e60000;
+ background: #222222;
+ width: 90px;
+ height: 28px;
+ cursor: pointer;
+ position: relative;
+ vertical-align: middle;
+ margin-left: -99px;
+}
+
+div[class^="sheet-section"] {
+ display: none;
+}
+
+input.sheet-tab1:checked~div.sheet-section-core,
+input.sheet-tab2:checked~div.sheet-section-skills,
+input.sheet-tab3:checked~div.sheet-section-combat,
+input.sheet-tab4:checked~div.sheet-section-gear,
+input.sheet-tab5:checked~div.sheet-section-mystic,
+input.sheet-tab6:checked~div.sheet-section-abilities,
+input.sheet-tab7:checked~div.sheet-section-reputation,
+input.sheet-tab8:checked~div.sheet-section-notes,
+input.sheet-tab9:checked~div.sheet-section-old-sheet {
+ display: block;
+}
+
+input.sheet-tab:checked+span {
+ border: 2px solid #ff1a1a;
+ color: #ff1a1a;
+ background: #444444;
+}
+
+
+/* ************************************************************************************************************************************************ */
+/* Headings */
+/* ************************************************************************************************************************************************ */
+
+h1,
+h2,
+h3 {
+ width: 100%;
+ text-align: center;
+}
+
+h1 {
+ height: 30px;
+ line-height: 30px;
+ border: none;
+ background-image: url("https://cdn.discordapp.com/attachments/645700678907330560/926221667225727108/warning-stripes-banner-transparent.png");
+ font-size: 20px;
+ color: white;
+ font-weight: normal;
+}
+
+.sheet-h1-box {
+ background-color: #222222;
+ padding: 5px 10px;
+ border-radius: 5px;
+}
+
+
+h2,
+h3 {
+ font-weight: normal;
+ font-size: 16px;
+ height: 28px;
+ line-height: 28px;
+}
+
+h2 {
+ color: #e60000;
+ padding-top: 2px;
+ padding-bottom: 2px;
+}
+
+h3 {
+ color: #e60000;
+ text-align: left;
+}
+
+
+/* ************************************************************************************************************************************************ */
+/* Expand/collapse (custom checkbox plus hiding a section)*/
+/* ************************************************************************************************************************************************ */
+
+.sheet-collapse-wrapper {
+ border: 2px solid #660000;
+ background-color: #141414D9;
+ margin-top: 20px;
+}
+
+/* Hide the browser's default checkbox */
+input.sheet-expand-collapse-checkbox {
+ position: absolute;
+ opacity: 0;
+ cursor: pointer;
+ margin-left: 7px;
+ margin-top: 4px;
+ width: 16px;
+}
+
+/* Show the checkmark when checked */
+input.sheet-expand-collapse-checkbox:checked~.sheet-expand-collapse-symbol:after {
+ display: block;
+ height: 24px;
+ width: 20px;
+ margin-left: 4px;
+ content: " ";
+ background-image: url('https://cdn.discordapp.com/attachments/645700678907330560/927259499654434856/expanded.png');
+ background-position: center;
+ background-repeat: no-repeat;
+}
+
+/* Style the checkmark/indicator */
+input.sheet-expand-collapse-checkbox~.sheet-expand-collapse-symbol:after {
+ display: block;
+ height: 24px;
+ width: 20px;
+ margin-left: 4px;
+ content: " ";
+ background-image: url('https://cdn.discordapp.com/attachments/645700678907330560/927259500027723836/collapsed.png');
+ background-position: center;
+ background-repeat: no-repeat;
+}
+
+input[type="checkbox"].sheet-expand-collapse-checkbox~.sheet-collapsible {
+ display: none;
+}
+
+input[type="checkbox"].sheet-expand-collapse-checkbox:checked~.sheet-collapsible {
+ display: block;
+}
+
+/* Designed to spill over on to the expand/collapse element below */
+.sheet-table-header-collapse {
+ height: 5px;
+ line-height: 30px;
+ padding: 0;
+}
+
+.sheet-collapse-section {
+ background-color: none;
+}
+
+.sheet-collapsible table,
+table.sheet-embedded-table {
+ border: 0;
+}
+
+
+
+/* ************************************************************************************************************************************************ */
+/* Flexbox columns */
+/* ************************************************************************************************************************************************ */
+
+.sheet-flex-section,
+.sheet-flex-section-centre,
+.sheet-flex-section-no-margin {
+ margin-left: -10px;
+ margin-right: -10px;
+ display: flex;
+ flex-wrap: wrap;
+}
+
+.sheet-flex-section,
+.sheet-flex-section-no-margin {
+ justify-content: space-between;
+}
+
+.sheet-flex-section-centre {
+ justify-content: space-around;
+}
+
+.sheet-flex-section {
+ margin-top: 20px;
+}
+
+.sheet-column-fixed {
+ flex-grow: 0;
+ margin: 10px;
+}
+
+.sheet-column-grow {
+ flex-grow: 1;
+ margin: 10px;
+}
+
+.sheet-flex-form-container {
+ display: flex;
+ flex-wrap: nowrap;
+ justify-content: space-between;
+}
+
+.sheet-flex-form-grow {
+ flex-grow: 1;
+}
+
+.sheet-flex-form-fixed {
+ flex-grow: 0;
+ padding-left: 2px;
+ padding-right: 2px;
+}
+
+.sheet-centred-section {
+ display: flex;
+ flex-flow: column nowrap;
+ align-items: center;
+}
+
+
+/* ************************************************************************************************************************************************ */
+/* Tables */
+/* ************************************************************************************************************************************************ */
+
+table {
+ width: 100%;
+ border: 2px solid #660000;
+ background-color: #141414D9;
+ table-layout: auto;
+}
+
+th,
+td {
+ border: 1px solid #660000;
+}
+
+th {
+ max-width: max-content;
+ white-space: nowrap;
+ font-size: 11px;
+ font-weight: bold;
+ color: darkgoldenrod;
+ padding-left: 10px;
+ padding-right: 10px;
+}
+
+th.sheet-small-table-header {
+ font-size: 0.9em;
+ font-weight: bold;
+ text-align: center;
+ height: 16px;
+ line-height: normal;
+}
+
+td.sheet-small-text,
+th.sheet-small-text {
+ text-align: center;
+ height: 28px;
+}
+
+td.sheet-small-text {
+ font-size: 0.9em;
+}
+
+th.sheet-small-text {
+ font-size: 0.9em;
+ font-weight: bold;
+}
+
+td.sheet-cell-numeric,
+td.sheet-cell-numeric-readonly {
+ text-align: center;
+ max-width: 50px;
+}
+
+.sheet-header-column {
+ width: 15em;
+}
+
+.sheet-button-cell {
+ text-align: center;
+}
+
+
+/* ************************************************************************************************************************************************ */
+/* Entry controls */
+/* ************************************************************************************************************************************************ */
+
+input,
+select,
+textarea,
+.sheet-input-like,
+.sheet-input-like-no-padding {
+ width: 100%;
+ background-color: #080808;
+ color: goldenrod;
+}
+
+.sheet-demon-gate-charsheet input[type=number],
+.sheet-demon-gate-charsheet input[type=text],
+.sheet-demon-gate-charsheet select {
+ border: 0;
+ border-radius: 0;
+}
+
+input[type="number"].sheet-totalfield,
+input[type="text"].sheet-totalfield {
+ text-align: center;
+ font-weight: bold;
+ font-size: 16px;
+ color: goldenrod;
+ background: none;
+ border: 0;
+ border-radius: 0;
+}
+
+input[type=number]::-webkit-inner-spin-button,
+input[type=number]::-webkit-outer-spin-button {
+ -webkit-appearance: none;
+ margin: 0;
+}
+
+input::placeholder,
+textarea::placeholder {
+ color: #604706;
+}
+
+.sheet-demon-gate-charsheet td input[type=number] {
+ min-width: 2.2em;
+ text-align: center;
+}
+
+.sheet-demon-gate-charsheet td input.sheet-input-full[type=number],
+.sheet-demon-gate-charsheet td.sheet-cell-numeric input[type=number] {
+ width: 100%;
+}
+
+.sheet-input-narrow {
+ width: 5em;
+ min-width: 5em;
+ max-width: 5em;
+}
+
+.sheet-read-only-field,
+td.sheet-cell-numeric-readonly,
+td input:read-only {
+ color: #916a08;
+ background: none;
+}
+
+.sheet-text-centred,
+td input[type=text].sheet-text-centred {
+ text-align: center;
+}
+
+.sheet-demon-gate-charsheet input[type=number].sheet-numeric-wide {
+ text-align: center;
+ width: 100%;
+}
+
+.sheet-tall-control,
+input.sheet-tall-control {
+ height: 36px;
+ line-height: 36px;
+ font-size: 16px;
+}
+
+td input[type=text].sheet-dice-field {
+ min-width: 7em;
+ text-align: center;
+}
+
+select:focus,
+input:focus,
+textarea:focus {
+ z-index: 100;
+ outline: 1px solid goldenrod;
+}
+
+.sheet-flex-form-container input[type=text]:focus,
+.sheet-spiritual-influence-image input[type=number]:focus {
+ z-index: auto;
+}
+
+.sheet-read-only-field:focus,
+td.sheet-cell-numeric-readonly:focus,
+td input:read-only:focus {
+ outline: none;
+}
+
+.sheet-input-like {
+ padding-left: 4px;
+}
+
+button.sheet-button,
+button.btn {
+ border: 2px solid #e60000;
+ border-radius: 4px;
+ color: #e60000;
+ text-shadow: none;
+}
+
+button.btn {
+ background: #222222;
+}
+
+button.btn:hover {
+ background: #444444;
+ color: #ff1a1a;
+}
+
+.sheet-demon-gate-charsheet button.sheet-display-text-button[type=roll]:before,
+.sheet-demon-gate-charsheet button.sheet-display-text-button-small[type=roll]:before {
+ content: "";
+}
+
+button.sheet-display-text-button-small {
+ height: 20px;
+}
+
+.sheet-demon-gate-charsheet button.sheet-display-text-button-small[type=roll] {
+ font-size: 0.8em;
+}
+
+.sheet-demon-gate-charsheet button.sheet-display-text-button[type=roll] {
+ font-size: 1em;
+}
+
+
+/* ************************************************************************************************************************************************ */
+/* Top section of first sheet */
+/* ************************************************************************************************************************************************ */
+.sheet-chaos-logo {
+ height: 116px;
+}
+
+.sheet-demon-gate-charsheet table td input {
+ height: 28px;
+ line-height: 28px;
+ margin: 0;
+}
+
+.sheet-demon-gate-charsheet table td select {
+ height: 36px;
+ line-height: 36px;
+ margin: 0;
+}
+
+.sheet-input-wide {
+ min-width: 12em;
+}
+
+.sheet-input-like-no-padding input.sheet-input-narrow {
+ max-width: 7.5em;
+}
+
+.sheet-demon-gate-charsheet td input.sheet-prominent-label,
+.sheet-demon-gate-charsheet td input.sheet-prominent-field {
+ height: 72px;
+}
+
+td input.sheet-prominent-field {
+ font-size: 30px;
+ text-align: center;
+}
+
+.sheet-vertical-margin {
+ margin-top: 10px;
+ margin-bottom: 10px;
+}
+
+.sheet-vertical-margin-moderate {
+ margin-top: 20px;
+ margin-bottom: 20px;
+}
+
+input[type=number].sheet-input-split {
+ max-width: 40%;
+ min-width: 1.1em;
+}
+
+td .sheet-input-spacer {
+ min-width: 1.1em;
+ text-align: center;
+}
+
+.sheet-beauty-table-spacer-cell {
+ min-width: 19.5em;
+}
+
+
+/* ************************************************************************************************************************************************ */
+/* HP, Mana etc. */
+/* ************************************************************************************************************************************************ */
+
+.sheet-column-prominent-stat {
+ flex-grow: 0;
+ width: 120px;
+ margin: 10px;
+}
+
+.sheet-demon-gate-charsheet td input.sheet-extra-prominent-field {
+ font-size: 36px;
+ height: 84px;
+}
+
+
+/* ************************************************************************************************************************************************ */
+/** Physical and mental conditions, including gradient colours */
+/* ************************************************************************************************************************************************ */
+
+.sheet-physical-condition-0,
+.sheet-physical-condition-1,
+.sheet-physical-condition-2,
+.sheet-physical-condition-3,
+.sheet-physical-condition-4,
+.sheet-physical-condition-5,
+.sheet-physical-condition-6,
+.sheet-mental-condition-0,
+.sheet-mental-condition-1,
+.sheet-mental-condition-2,
+.sheet-mental-condition-3,
+.sheet-mental-condition-4,
+.sheet-mental-condition-5,
+.sheet-mental-condition-6 {
+ width: 14%;
+}
+
+tr td.sheet-physical-condition-0 {
+ background-color: #ff000000;
+}
+
+tr td.sheet-physical-condition-1 {
+ background-color: #ff00001A;
+}
+
+tr td.sheet-physical-condition-2 {
+ background-color: #ff000033;
+}
+
+tr td.sheet-physical-condition-3 {
+ background-color: #ff00004D;
+}
+
+tr td.sheet-physical-condition-4 {
+ background-color: #ff000066;
+}
+
+tr td.sheet-physical-condition-5 {
+ background-color: #ff000080;
+}
+
+tr td.sheet-physical-condition-6 {
+ background-color: #ff000099;
+}
+
+tr td.sheet-mental-condition-0 {
+ background-color: #0080ff00;
+}
+
+tr td.sheet-mental-condition-1 {
+ background-color: #0080ff1A;
+}
+
+tr td.sheet-mental-condition-2 {
+ background-color: #0080ff33;
+}
+
+tr td.sheet-mental-condition-3 {
+ background-color: #0080ff4D;
+}
+
+tr td.sheet-mental-condition-4 {
+ background-color: #0080ff66;
+}
+
+tr td.sheet-mental-condition-5 {
+ background-color: #0080ff80;
+}
+
+tr td.sheet-mental-condition-6 {
+ background-color: #0080ff99;
+}
+
+
+/* ************************************************************************************************************************************************ */
+/* Skills tab
+/* ************************************************************************************************************************************************ */
+
+.sheet-top-margin {
+ margin-top: 40px;
+}
+
+.charsheet select.sheet-skilldescshort {
+ width: 4.2em;
+ margin: 0;
+ border: 0;
+ border-radius: 0;
+}
+
+.sheet-skillname,
+.sheet-skillname-indented {
+ padding-right: 10px;
+ width: 9em;
+}
+
+.sheet-skillname {
+ padding-left: 10px;
+}
+
+.sheet-skillname-indented {
+ padding-left: 30px;
+}
+
+.sheet-skillname-input-cell {
+ width: 10.5em;
+}
+
+
+/* ************************************************************************************************************************************************ */
+/* Abilities and notes tabs
+/* ************************************************************************************************************************************************ */
+textarea.sheet-text-area-full,
+textarea.sheet-text-area-large,
+textarea.sheet-standalone-textarea,
+textarea.sheet-textarea-gems,
+textarea.sheet-textarea-equipment {
+ box-sizing: border-box;
+ resize: none;
+ width: 100%;
+ margin-bottom: 0;
+ margin-left: 0;
+ margin-right: 0;
+}
+
+textarea.sheet-text-area-full {
+ margin-left: 0;
+ margin-right: 0;
+ border-radius: 0;
+ border: none;
+ height: 150px;
+}
+
+textarea.sheet-text-area-large {
+ margin-top: 0;
+ border: 0;
+ border-radius: 0;
+ height: 300px;
+}
+
+.sheet-repeating-section {
+ margin-top: 10px;
+ margin-bottom: 10px;
+ background-color: #141414D9;
+ border: 2px solid #660000;
+}
+
+/* This could probably be added to h2 (and maybe h1?) with a bit of reorg */
+.sheet-spacer-top-margin {
+ margin-top: 20px;
+}
+
+h1.sheet-spacer-top-margin {
+ margin-top: 40px;
+}
+
+.sheet-standalone-textarea,
+.sheet-textarea-gems,
+.sheet-textarea-equipment {
+ margin-top: 20px;
+ border: 2px solid #660000;
+ border-radius: 0;
+}
+
+textarea.sheet-standalone-textarea {
+ height: 150px;
+}
+
+textarea.sheet-textarea-gems {
+ height: 530px;
+}
+
+textarea.sheet-textarea-equipment {
+ height: 570px;
+}
+
+
+/* TODO: This is a hack - sorting out heading spacing properly and removing it from flex sections should allow this to be removed */
+.sheet-remove-margin-bottom {
+ margin-bottom: -10px;
+}
+
+
+
+/* ************************************************************************************************************************************************ */
+/* Mystic tab
+/* ************************************************************************************************************************************************ */
+
+.sheet-table-wrapper {
+ border: 2px solid #660000;
+ background-color: #141414D9;
+}
+
+.sheet-religion-table table {
+ border: 0;
+}
+
+.sheet-religion-table table td {
+ border-right: 0;
+}
+
+.sheet-spiritual-influence-header {
+ border: 2px solid #660000;
+ background-color: #141414D9;
+}
+
+.sheet-spiritual-influence-image {
+ background: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Demon%20Gate/Circle.png");
+ background-repeat: no-repeat;
+ background-size: contain;
+ background-position: center;
+ height: 271px;
+ width: 288px;
+ display: flex;
+ flex-flow: column nowrap;
+ align-items: center;
+ justify-content: center;
+}
+
+.sheet-spiritual-influence-image input[type=number].sheet-spiritual-influence {
+ width: 2.2em;
+ font-size: 18px;
+ text-align: center;
+ border-radius: 20px;
+ height: 40px;
+ line-height: 40px;
+ padding: 0;
+ border: 2px solid #660000;
+}
+
+textarea.sheet-spell-description,
+textarea.sheet-chi-ability-description {
+ box-sizing: border-box;
+ resize: none;
+ width: 100%;
+ min-width: 30em;
+ margin: 0;
+ border: none;
+}
+
+textarea.sheet-spell-description {
+ height: 120px;
+}
+
+textarea.sheet-chi-ability-description {
+ height: 105px;
+}
+
+th.sheet-cell-moderate-width {
+ width: 10em;
+}
+
+th.sheet-cell-narrow {
+ width: 4em;
+}
+
+tr.sheet-spell-padding-row {
+ height: 36px;
+}
+
+tr.sheet-spell-spacer-row {
+ height: 4px;
+}
+
+
+/* ************************************************************************************************************************************************ */
+/* Roll Templates
+/* ************************************************************************************************************************************************ */
+
+.sheet-rolltemplate-text .sheet-template-container {
+ width: 100%;
+}
+
+.sheet-rolltemplate-text .sheet-template-box,
+.sheet-rolltemplate-class-ability-text .sheet-template-box,
+.sheet-rolltemplate-percentile .sheet-template-box,
+.sheet-rolltemplate-attack .sheet-template-box,
+.sheet-rolltemplate-damage .sheet-template-box,
+.sheet-rolltemplate-roll .sheet-template-box,
+.sheet-rolltemplate-spell-description .sheet-template-box,
+.sheet-rolltemplate-spell-cast .sheet-template-box,
+.sheet-rolltemplate-spell-effect .sheet-template-box,
+.sheet-rolltemplate-simple .sheet-template-box,
+.sheet-rolltemplate-two-part .sheet-template-box {
+ width: 100%;
+ border: 2px solid #b30000;
+ background-image: url("https://cdn.discordapp.com/attachments/645700678907330560/926168705115754566/102743921_small.jpg");
+ background-color: #08080833;
+ color: goldenrod;
+}
+
+.sheet-rolltemplate-text .sheet-template-title,
+.sheet-rolltemplate-class-ability-text .sheet-template-title,
+.sheet-rolltemplate-percentile .sheet-template-title,
+.sheet-rolltemplate-attack .sheet-template-title,
+.sheet-rolltemplate-damage .sheet-template-title,
+.sheet-rolltemplate-roll .sheet-template-title,
+.sheet-rolltemplate-spell-description .sheet-template-title,
+.sheet-rolltemplate-spell-cast .sheet-template-title,
+.sheet-rolltemplate-spell-effect .sheet-template-title,
+.sheet-rolltemplate-simple .sheet-template-title,
+.sheet-rolltemplate-two-part .sheet-template-title {
+ width: 100%;
+ text-align: center;
+ color: #ff1a1a;
+ background-color: #14141499;
+ font-weight: normal;
+ font-size: 16px;
+ padding: 8px 0;
+}
+
+.sheet-rolltemplate-attack .sheet-template-subtitle,
+.sheet-rolltemplate-damage .sheet-template-subtitle,
+.sheet-rolltemplate-roll .sheet-template-subtitle,
+.sheet-rolltemplate-spell-cast .sheet-template-subtitle,
+.sheet-rolltemplate-spell-effect .sheet-template-subtitle,
+.sheet-rolltemplate-simple .sheet-template-subtitle,
+.sheet-rolltemplate-two-part .sheet-template-subtitle {
+ width: 100%;
+ text-align: center;
+ color: #b30000;
+ background-color: #14141499;
+ font-weight: normal;
+ font-size: 12px;
+ padding-bottom: 2px;
+}
+
+.sheet-rolltemplate-text .sheet-template-text,
+.sheet-rolltemplate-class-ability-text .sheet-template-text,
+.sheet-rolltemplate-percentile .sheet-template-text,
+.sheet-rolltemplate-spell-description .sheet-template-text {
+ font-size: 13px;
+ padding: 4px;
+}
+
+.sheet-rolltemplate-class-ability-text th,
+.sheet-rolltemplate-percentile th,
+.sheet-rolltemplate-spell-description th,
+.sheet-rolltemplate-spell-cast th,
+.sheet-rolltemplate-spell-effect th {
+ font-size: 13px;
+ padding: 4px;
+ font-weight: bold;
+}
+
+.sheet-rolltemplate-attack th,
+.sheet-rolltemplate-damage th,
+.sheet-rolltemplate-roll th {
+ font-size: 16px;
+ padding: 10px;
+ font-weight: bold;
+}
+
+.sheet-rolltemplate-class-ability-text td,
+.sheet-rolltemplate-percentile td,
+.sheet-rolltemplate-spell-description td,
+.sheet-rolltemplate-spell-cast td,
+.sheet-rolltemplate-spell-effect td {
+ font-size: 13px;
+ text-align: center;
+ min-width: 3em;
+ padding: 4px;
+}
+
+.sheet-rolltemplate-attack td,
+.sheet-rolltemplate-damage td,
+.sheet-rolltemplate-roll td {
+ font-size: 16px;
+ text-align: center;
+ min-width: 3em;
+ padding: 10px;
+}
+
+.sheet-rolltemplate-percentile .sheet-template-success,
+.sheet-rolltemplate-percentile .sheet-template-failure {
+ font-size: 16px;
+ font-weight: bold;
+ padding: 10px;
+ margin-top: 4px;
+ text-align: center;
+}
+
+.sheet-rolltemplate-percentile .sheet-template-success {
+ color: green;
+}
+
+.sheet-rolltemplate-percentile .sheet-template-failure {
+ color: red;
+}
+
+.sheet-rolltemplate-simple .sheet-template-text-prominent,
+.sheet-rolltemplate-two-part .sheet-template-text-prominent {
+ font-size: 16px;
+ padding: 10px;
+ text-align: center;
+}
+
+.sheet-rolltemplate-two-part .sheet-template-text-supplementary {
+ font-size: 13px;
+ padding: 10px;
+ text-align: center;
+}
+
+/* Override the default roll styling */
+
+.sheet-rolltemplate-text .sheet-template-box .inlinerollresult,
+.sheet-rolltemplate-class-ability-text .sheet-template-box .inlinerollresult,
+.sheet-rolltemplate-percentile .sheet-template-box .inlinerollresult,
+.sheet-rolltemplate-attack .sheet-template-box .inlinerollresult,
+.sheet-rolltemplate-damage .sheet-template-box .inlinerollresult,
+.sheet-rolltemplate-roll .sheet-template-box .inlinerollresult,
+.sheet-rolltemplate-spell-description .sheet-template-box .inlinerollresult,
+.sheet-rolltemplate-spell-cast .sheet-template-box .inlinerollresult,
+.sheet-rolltemplate-spell-effect .sheet-template-box .inlinerollresult,
+.sheet-rolltemplate-simple .sheet-template-box .inlinerollresult,
+.sheet-rolltemplate-two-part .sheet-template-box .inlinerollresult {
+ background-color: #222222;
+ border: 1px solid #660000;
+}
+
+.sheet-rolltemplate-text .sheet-template-box .inlinerollresult.importantroll,
+.sheet-rolltemplate-class-ability-text .sheet-template-box .inlinerollresult.importantroll,
+.sheet-rolltemplate-percentile .sheet-template-box .inlinerollresult.importantroll,
+.sheet-rolltemplate-attack .sheet-template-box .inlinerollresult.importantroll,
+.sheet-rolltemplate-damage .sheet-template-box .inlinerollresult.importantroll,
+.sheet-rolltemplate-roll .sheet-template-box .inlinerollresult.importantroll,
+.sheet-rolltemplate-spell-description .sheet-template-box .inlinerollresult.importantroll,
+.sheet-rolltemplate-spell-cast .sheet-template-box .inlinerollresult.importantroll,
+.sheet-rolltemplate-spell-effect .sheet-template-box .inlinerollresult.importantroll,
+.sheet-rolltemplate-simple .sheet-template-box .inlinerollresult.importantroll,
+.sheet-rolltemplate-two-part .sheet-template-box .inlinerollresult.importantroll {
+ border: 1px solid #b30000;
+}
+
+.sheet-rolltemplate-text .sheet-template-box .inlinerollresult.fullcrit,
+.sheet-rolltemplate-class-ability-text .sheet-template-box .inlinerollresult.fullcrit,
+.sheet-rolltemplate-percentile .sheet-template-box .inlinerollresult.fullcrit,
+.sheet-rolltemplate-attack .sheet-template-box .inlinerollresult.fullcrit,
+.sheet-rolltemplate-damage .sheet-template-box .inlinerollresult.fullcrit,
+.sheet-rolltemplate-roll .sheet-template-box .inlinerollresult.fullcrit,
+.sheet-rolltemplate-spell-description .sheet-template-box .inlinerollresult.fullcrit,
+.sheet-rolltemplate-spell-cast .sheet-template-box .inlinerollresult.fullcrit,
+.sheet-rolltemplate-spell-effect .sheet-template-box .inlinerollresult.fullcrit,
+.sheet-rolltemplate-simple .sheet-template-box .inlinerollresult.fullcrit,
+.sheet-rolltemplate-two-part .sheet-template-box .inlinerollresult.fullcrit {
+ color: green;
+ border: 1px solid #b30000;
+}
+
+.sheet-rolltemplate-text .sheet-template-box .inlinerollresult.fullfail,
+.sheet-rolltemplate-class-ability-text .sheet-template-box .inlinerollresult.fullfail,
+.sheet-rolltemplate-percentile .sheet-template-box .inlinerollresult.fullfail,
+.sheet-rolltemplate-attack .sheet-template-box .inlinerollresult.fullfail,
+.sheet-rolltemplate-damage .sheet-template-box .inlinerollresult.fullfail,
+.sheet-rolltemplate-roll .sheet-template-box .inlinerollresult.fullfail,
+.sheet-rolltemplate-spell-description .sheet-template-box .inlinerollresult.fullfail,
+.sheet-rolltemplate-spell-cast .sheet-template-box .inlinerollresult.fullfail,
+.sheet-rolltemplate-spell-effect .sheet-template-box .inlinerollresult.fullfail,
+.sheet-rolltemplate-simple .sheet-template-box .inlinerollresult.fullfail,
+.sheet-rolltemplate-two-part .sheet-template-box .inlinerollresult.fullfail {
+ color: #ff1a1a;
+ border: 1px solid #b30000;
+}
diff --git a/Chaos 6010/Chaos 6010.html b/Chaos 6010/Chaos 6010.html
index 90ef2c0363..ec17255843 100644
--- a/Chaos 6010/Chaos 6010.html
+++ b/Chaos 6010/Chaos 6010.html
@@ -1,692 +1,8870 @@
-
-
-
-
Player Information
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
Actions and Attacks
-
-
-
-
Defense
-
-
-
-
-
-
-
-
-
-
-
-
-
Attributes
-
-
-
-
-
-
-
-
+
-
-
-
Weapons
-
-
-
-
-
-
Armor and Clothing
-
-
-
-
-
-
Resistances
-
-
-
-
Equipent(belt)
-
-
-
-
-
-
-
-
-
-
-
Racial Abilities
-
+
-
+
+
-
Class Abilities
-