From 7d7586f1995b71d69da696673e539c72d7fb36e0 Mon Sep 17 00:00:00 2001
From: Villain1nGlasses <85969638+Villain1nGlasses@users.noreply.github.com>
Date: Sun, 6 Mar 2022 14:55:00 -0700
Subject: [PATCH 1/3] Update HeroSystem6eHeroic.html

Fixes for dark mode.
---
 HeroSystem6eHeroic/HeroSystem6eHeroic.html | 187 +++++++++++----------
 1 file changed, 102 insertions(+), 85 deletions(-)

diff --git a/HeroSystem6eHeroic/HeroSystem6eHeroic.html b/HeroSystem6eHeroic/HeroSystem6eHeroic.html
index af5411c868..f2a88285b8 100644
--- a/HeroSystem6eHeroic/HeroSystem6eHeroic.html
+++ b/HeroSystem6eHeroic/HeroSystem6eHeroic.html
@@ -22,7 +22,7 @@
 			
 			<div class="item-characteristics-bio">
 				<div class="item-characteristics-bio-nameLabel">
-					<label>Name:</label>
+					<h1>Name:</h1>
 				</div>
 				
 				<div class="item-characteristics-bio-nameText">
@@ -30,7 +30,7 @@
 				</div>
 				
 				<div class="item-characteristics-bio-titleLabel">
-					<label>Title:</label>
+					<h1>Title:</h1>
 				</div>
 				
 				<div class="item-characteristics-bio-titleText">
@@ -38,7 +38,7 @@
 				</div>
 				
 				<div class="item-characteristics-bio-backgroundLabel">
-					<label>Background:</label>
+					<h1>Background:</h1>
 				</div>
 				
 				<div class="item-characteristics-bio-backgroundText">
@@ -49,7 +49,7 @@
 			<div class="item-characteristics-earnings">
 				
 				<div class="item-characteristics-earnings-experienceLabel">
-					<label>Experience:</label>
+					<h1>Experience:</h1>
 				</div>
 				
 				<div class="item-characteristics-earnings-experience">
@@ -69,12 +69,12 @@
 				
 				<div class="item-characteristics-primary-attributes-names">
 					<h1>Characteristics</h1>
-					<label>Strength</label>
-					<label>Dexterity</label>
-					<label>Constitution</label>
-					<label>Intelligence</label>
-					<label>Ego</label>
-					<label>Presence</label> 
+					<h2>Strength</h2>
+					<h2>Dexterity</h2>
+					<h2>Constitution</h2>
+					<h2>Intelligence</h2>
+					<h2>Ego</h2>
+					<h2>Presence</h2> 
 				</div>
 					
 				<div class="item-characteristics-primary-attributes-values">
@@ -115,82 +115,82 @@
 				
 				<div class="item-characteristics-primary-attributes-costs">
 					<h1>CP</h1>
-					<label><input type="text" value="0" name="attr_strengthCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_dexterityCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_constitutionCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_intelligenceCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_egoCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_presenceCP" readonly tabindex="-1"/></label> 
+					<input type="text" value="0" name="attr_strengthCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_dexterityCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_constitutionCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_intelligenceCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_egoCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_presenceCP" readonly tabindex="-1"/> 
 				</div>
 			</div>
 			
 			<div class="item-characteristics-combat-attributes">
 				<div class="item-characteristics-combat-attributes-names">
 					<h1>Combat Abilities</h1>
-					<label>OCV</label>
-					<label>DCV</label>
-					<label>OMCV</label>
-					<label>DMCV</label>
-					<label>Speed</label>
-					<label>Physical Defense</label>
-					<label>Energy Defense</label>
-					<label>Body</label>
-					<label>Stun</label>
-					<label>Endurance</label>
-					<label>Recovery</label>
+					<h2>OCV</h2>
+					<h2>DCV</h2>
+					<h2>OMCV</h2>
+					<h2>DMCV</h2>
+					<h2>Speed</h2>
+					<h2>Physical Defense</h2>
+					<h2>Energy Defense</h2>
+					<h2>Body</h2>
+					<h2>Stun</h2>
+					<h2>Endurance</h2>
+					<h2>Recovery</h2>
 				</div>
 				
 				<div class="item-characteristics-combat-attributes-values">
 					<h1>Value</h1>
-					<label><input type="number" value="3" name="attr_ocv" min="1" tabindex="12"/></label>
-					<label><input type="number" value="3" name="attr_dcv" min="1" tabindex="13"/></label>
-					<label><input type="number" value="3" name="attr_omcv" min="1" tabindex="14"/></label>
-					<label><input type="number" value="3" name="attr_dmcv" min="1" tabindex="15"/></label>
-					<label><input type="number" value="2" name="attr_speed" min="1" max="12" tabindex="16"/></label>
-					<label><input type="number" value="2" name="attr_pd" min="1" tabindex="17"/></label>
-					<label><input type="number" value="2" name="attr_ed" min="1" tabindex="18"/></label>
-					<label><input type="number" value="10" name="attr_body" min ="1" tabindex="19"/></label>
-					<label><input type="number" value="20" name="attr_stun" min="0" step="2" tabindex="20"/></label>
-					<label><input type="number" value="20" name="attr_endurance" min="0" step="5" tabindex="21"/></label>
-					<label><input type="number" value="4" name="attr_recovery" min="1" tabindex="22"/></label>
+					<input type="number" value="3" name="attr_ocv" min="1" tabindex="12"/>
+					<input type="number" value="3" name="attr_dcv" min="1" tabindex="13"/>
+					<input type="number" value="3" name="attr_omcv" min="1" tabindex="14"/>
+					<input type="number" value="3" name="attr_dmcv" min="1" tabindex="15"/>
+					<input type="number" value="2" name="attr_speed" min="1" max="12" tabindex="16"/>
+					<input type="number" value="2" name="attr_pd" min="1" tabindex="17"/>
+					<input type="number" value="2" name="attr_ed" min="1" tabindex="18"/>
+					<input type="number" value="10" name="attr_body" min ="1" tabindex="19"/>
+					<input type="number" value="20" name="attr_stun" min="0" step="2" tabindex="20"/>
+					<input type="number" value="20" name="attr_endurance" min="0" step="5" tabindex="21"/>
+					<input type="number" value="4" name="attr_recovery" min="1" tabindex="22"/>
 				</div>
 			
 				<div class="item-characteristics-combat-attributes-costs">
 					<h1>CP</h1>
-					<label><input type="text" value="0" name="attr_ocvCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_dcvCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_omcvCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_dmcvCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_speedCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_pdCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_edCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_bodyCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_stunCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_enduranceCP" readonly tabindex="-1"/></label>
-					<label><input type="text" value="0" name="attr_recoveryCP" readonly tabindex="-1"/></label>
+					<input type="text" value="0" name="attr_ocvCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_dcvCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_omcvCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_dmcvCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_speedCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_pdCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_edCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_bodyCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_stunCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_enduranceCP" readonly tabindex="-1"/>
+					<input type="text" value="0" name="attr_recoveryCP" readonly tabindex="-1"/>
 				</div>
 			</div>
 			  
 			  <div class="item-characteristics-movement-abilities">
-				  <div class="item-characteristics-movement-abilities-names">
-					  <h1>Movement</h1>
-					  <label>Running</label>
-					  <label>Leaping</label>
-					  <label>Swimming</label>
-				  </div>
+				    <div class="item-characteristics-movement-abilities-names">
+						<h1>Movement</h1>
+						<h2>Running</h2>
+						<h2>Leaping</h2>
+						<h2>Swimming</h2>
+				    </div>
 				  
-				  <div class="item-characteristics-movement-abilities-values">
+				   <div class="item-characteristics-movement-abilities-values">
 						<h1>Value</h1>
-						<label><input type="number" value="12" name="attr_running" min="0" step="1" tabindex="23"/></label> <br>
-						<label><input type="number" value="4" name="attr_leaping" min="0" step="2" tabindex="24"/></label><br>
-						<label><input type="number" value="4" name="attr_swimming" min="0" step="2" tabindex="25"/> </label> <br>
+						<input type="number" value="12" name="attr_running" min="0" step="1" tabindex="23"/>
+						<input type="number" value="4" name="attr_leaping" min="0" step="2" tabindex="24"/>
+						<input type="number" value="4" name="attr_swimming" min="0" step="2" tabindex="25"/>
 					</div>
 					
 					<div class="item-characteristics-movement-abilities-costs">
-						  <h1>CP</h1>
-						  <label><input type="text" value="0" name="attr_runningCP" readonly tabindex="-1"/></label> <br>
-						  <label><input type="text" value="0" name="attr_leapingCP" readonly tabindex="-1"/></label> <br>
-						  <label><input type="text" value="0" name="attr_swimmingCP" readonly tabindex="-1"/></label> <br>
+						<h1>CP</h1>
+						<input type="text" value="0" name="attr_runningCP" readonly tabindex="-1"/>
+						<input type="text" value="0" name="attr_leapingCP" readonly tabindex="-1"/>
+						<input type="text" value="0" name="attr_swimmingCP" readonly tabindex="-1"/>
 					</div>
 			  </div>
 		</div>
@@ -3543,31 +3543,48 @@
 <div class="sheet-options">
 	<div class="grid-container-tab-options">
 		<div class="item-options">
-			<label> Options </label>
-			<label class="container-checkbox">Characteristic Maximums
-				<input type="checkbox" checked="checked" name="attr_useCharacteristicMaximums">
-				<span class="checkmark"></span>
-			</label>
+			<div class="item-options-row">
+				<h1> Options </h1>
+			</div>
+			<div class="item-options-row">
+				<label class="container-checkbox">
+					<input type="checkbox" checked="checked" name="attr_useCharacteristicMaximums">
+					<span class="checkmark"></span>
+				</label>
+				<h1>Characteristic Maximums</h1>
+			</div>
 			
-			<label class="container-checkbox">Literacy Costs Character Points
-				<input type="checkbox" checked="checked" name="attr_optionLiteracyCostsPoints">
-				<span class="checkmark"></span>
-			</label>
+			<div class="item-options-row">
+				<label class="container-checkbox">
+					<input type="checkbox" checked="checked" name="attr_optionLiteracyCostsPoints">
+					<span class="checkmark"></span>
+				</label>
+				<h1>Literacy Costs Character Points</h1>
+			</div>
 			
-			<label class="container-checkbox">Attack and Power Buttons Apply END Costs
-				<input type="checkbox" checked="checked" name="attr_optionAutoSubtractEND">
-				<span class="checkmark"></span>
-			</label>
+			<div class="item-options-row">
+				<label class="container-checkbox">
+					<input type="checkbox" checked="checked" name="attr_optionAutoSubtractEND">
+					<span class="checkmark"></span>
+				</label>
+				<h1>Attack and Power Buttons Apply END Costs</h1>
+			</div>
 			
-			<label class="container-checkbox">Super-Heroic Campaign Endurance
-				<input type="checkbox" name="attr_optionSuperHeroicEndurance">
-				<span class="checkmark"></span>
-			</label>
+			<div class="item-options-row">
+				<label class="container-checkbox">
+					<input type="checkbox" name="attr_optionSuperHeroicEndurance">
+					<span class="checkmark"></span>
+				</label>
+				<h1>Super-Heroic Campaign Endurance</h1>
+			</div>
 			
-			<label class="container-checkbox">Use Hit Location System
-				<input type="checkbox" name="attr_optionHitLocationSystem">
-				<span class="checkmark"></span>
-			</label>
+			<div class="item-options-row">
+				<label class="container-checkbox">
+					<input type="checkbox" name="attr_optionHitLocationSystem">
+					<span class="checkmark"></span>
+				</label>
+				<h1>Use Hit Location System</h1>
+			</div>
 		</div>
 	</div>
 </div>
@@ -8633,4 +8650,4 @@
 	
 	// End sheet workers
 
-</script>
\ No newline at end of file
+</script>

From 1bd4c734243b3dbbea1a09c2cf91ff0f1893c03a Mon Sep 17 00:00:00 2001
From: Villain1nGlasses <85969638+Villain1nGlasses@users.noreply.github.com>
Date: Sun, 6 Mar 2022 14:55:34 -0700
Subject: [PATCH 2/3] Update HeroSystem6eHeroic.css

Fixes for dark mode.
---
 HeroSystem6eHeroic/HeroSystem6eHeroic.css | 277 ++++++++++------------
 1 file changed, 129 insertions(+), 148 deletions(-)

diff --git a/HeroSystem6eHeroic/HeroSystem6eHeroic.css b/HeroSystem6eHeroic/HeroSystem6eHeroic.css
index 4219b11150..da0f14da08 100644
--- a/HeroSystem6eHeroic/HeroSystem6eHeroic.css
+++ b/HeroSystem6eHeroic/HeroSystem6eHeroic.css
@@ -344,6 +344,27 @@ select:focus + .focus {
 	margin-bottom: 5px;
 }
 
+.grid-container-characteristics-leftGrid  h1 {
+	padding-left: 0px;
+	padding-top: 5px;
+	padding-bottom: 0px;
+	margin: 0px;
+	font-size: 13px;
+	font-style: normal;
+	line-height: 1.40;
+	min-width: 54px;
+}
+
+.grid-container-characteristics-leftGrid  h2 {
+	height: 20px;
+	line-height: 1.6;
+	margin-left: 5px;
+	margin-bottom: 0px;
+	margin-top: 2px;
+	font-size: 13px;
+	font-style: normal;
+}
+
 /* Item: logo graphic bio0 */
 
 .item-characteristics-logo {
@@ -464,12 +485,19 @@ select:focus + .focus {
 	vertical-align: top;
 }
 
+.item-characteristics-earnings h1 {
+	margin-bottom: 10px;
+	padding-left: 3px;
+	padding-top: 4px;
+	line-height: 1.3;
+}
+
 .item-characteristics-earnings input[type=number] {
 	text-align: right;
 	padding-right: 1px;
 	border: solid 1px palegoldenrod;
 	padding-top: 2px;
-	margin-bottom: 1px;
+	margin-bottom: 5px;
 }
 
 .item-characteristics-earnings input[type=text] {
@@ -479,7 +507,8 @@ select:focus + .focus {
 	background-color: #fff990;
 	font-weight: bold;
 	margin-top: 0px;
-	margin-bottom: 2px;
+	margin-bottom: 1px;
+	color: black;
 }
 
 /* Subitem: Character Experience */
@@ -504,6 +533,7 @@ select:focus + .focus {
 
 .item-characteristics-earnings-money input[type=number] {
 	min-width: 70px;
+	margin-bottom: 5px;
 }
 
 /* Item: core abilities */
@@ -512,7 +542,7 @@ select:focus + .focus {
 	display: grid;
 	grid-template-areas:
 	"primaryAbilityNames primaryAbilityValues primaryAbilityChances primaryAbilityButtons primaryAbilityCosts";
-	grid-template-columns: 126px 49px 50px 40px 45px;
+	grid-template-columns: 126px 49px 50px 45px 45px;
 	min-width: 300px;
 	vertical-align: middle;
 	margin-left: 6px;
@@ -526,22 +556,22 @@ select:focus + .focus {
 }
 
 .item-characteristics-primary-attributes h1 {
-	margin-left: 0px;
-	padding-left: 0px;
-	padding-top: 4px;
-	padding-bottom: 0px;
+	background: gold;
+	padding-left: 5px;
+	padding-right: 6px;
+	padding-top: 2px;
+	padding-bottom: 2px;
 	margin: 0px;
+	margin-top: 0px;
 	font-size: 13px;
 	font-style: normal;
-	line-height: 1.48;
-	min-width: 54px;
+	line-height: 1.35;
 }
 
-.item-characteristics-primary-attributes h1:nth-child(1){
-	background-color: gold;
+.item-characteristics-primary-attributes h2 {
+	margin-left: 8px;
 }
 
-
 .item-characteristics-primary-attributes input[type=number] {
 	text-align: right;
 	padding-right: 0px;
@@ -554,21 +584,6 @@ select:focus + .focus {
 	max-width: 45px;
 }
 
-.item-characteristics-primary-attributes label {
-	height: 20px;
-	line-height: 1.6;
-	margin-left: 5px;
-	margin-bottom: 1px;
-	margin-top: 2px;
-}
-
-.item-characteristics-primary-attributes label:nth-child(1) {
-	background: gold;
-	margin-left: 0px;
-	padding-left: 1px;
-	padding-top: 3px;
-}
-
 /* Sub-Item: core abilities characteristics */
 .item-characteristics-primary-attributes-names {
 	grid-area: primaryAbilityNames;
@@ -592,10 +607,6 @@ select:focus + .focus {
 	max-width: 55px;
 }
 
-.item-characteristics-primary-attributes h1 {
-	padding-left: 5px;
-}
-
 /* Sub-Item: core abilities values */
 .item-characteristics-primary-attributes-rollChances {
 	grid-area: primaryAbilityChances;
@@ -608,7 +619,7 @@ select:focus + .focus {
 }
 
 .item-characteristics-primary-attributes-rollChances h1 {
-	padding-left: 8px;
+	margin-left: 6px;
 }
 
 /* Sub-Item: core abilities values */
@@ -633,7 +644,9 @@ select:focus + .focus {
 }
 
 .item-characteristics-primary-attributes-costs h1 {
-	padding-left: 2px;
+	margin-left: 8px;
+	text-align: left;
+	min-width: 32px;
 }
 
 /* Item: combat abilities */
@@ -642,7 +655,7 @@ select:focus + .focus {
 	display: grid;
 	grid-template-areas:
 	"combatAbilityNames combatAbilityValues . . combatAbilityCosts";
-	grid-template-columns: 120px 50px 55px 40px 45px;
+	grid-template-columns: 126px 49px 50px 45px 45px;
 	min-width: 300px;
 	vertical-align: middle;
 	margin-left: 6px;
@@ -667,41 +680,30 @@ select:focus + .focus {
 	max-width: 45px;
 }
 
-.item-characteristics-combat-attributes label:nth-child(1) {
+.item-characteristics-combat-attributes h1 {
 	background: gold;
-	margin-left: 0px;
-	padding-left: 1px;
+	padding-left: 5px;
+	padding-right: 6px;
+	padding-top: 2px;
+	padding-bottom: 2px;
+	margin: 0px;
+	margin-top: 0px;
+	font-size: 13px;
+	font-style: normal;
+	line-height: 1.35;
 }
 
-.item-characteristics-combat-attributes label {
-	height: 20px;
-	line-height: 1.6;
-	margin: 0;
-	margin-left: 6px;
-}
-
-.item-characteristics-combat-attributes label:nth-child(1) {
-	background: gold;
+.item-characteristics-combat-attributes h2 {
+	margin-left: 8px;
 }
 
 /* Sub-Item: combat abilities characteristics */
 .item-characteristics-combat-attributes-names {
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
 	text-align: left;
 	grid-area: combatAbilityNames;
-}
-
-.item-characteristics-combat-attributes-names h1 {
-	background: gold;
-	margin-left: 0px;
-	padding-left: 2px;
-	padding-right: 50px;
-	padding-top: 2px;
-	padding-bottom: 1px;
-	margin: 0px;
-	margin-top: 1px;
-	font-size: 13px;
-	font-style: normal;
-	line-height: 1.35;
 	min-width: 120px;
 }
 
@@ -709,21 +711,10 @@ select:focus + .focus {
 .item-characteristics-combat-attributes-values {
 	text-align: center;
 	grid-area: combatAbilityValues;
-}
-
-.item-characteristics-combat-attributes-values h1 {
-	background: gold;
-	margin-left: 0px;
-	padding-left: 12px;
-	padding-right: 17px;
-	padding-top: 2px;
-	padding-bottom: 1px;
-	margin: 0px;
-	margin-top: 1px;
-	font-size: 13px;
-	font-style: normal;
-	line-height: 1.35;
-	min-width: 120px;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+	min-width: 152px;
 	text-align: left;
 }
 
@@ -731,21 +722,15 @@ select:focus + .focus {
 .item-characteristics-combat-attributes-costs {
 	grid-area: combatAbilityCosts;
 	text-align: right;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
 }
 
 .item-characteristics-combat-attributes-costs h1 {
-	background: gold;
-	margin-left: 0px;
-	padding-left: 1px;
-	padding-right: 17px;
-	padding-top: 2px;
-	padding-bottom: 1px;
-	margin: 0px;
-	margin-top: 1px;
-	font-size: 13px;
-	font-style: normal;
-	line-height: 1.35;
-	min-width: 38px;
+	margin-left: 8px;
+	text-align: left;
+	min-width: 32px;
 }
 
 /* Item: combat abilities */
@@ -754,7 +739,7 @@ select:focus + .focus {
 	display: grid;
 	grid-template-areas:
 	"movementNames movementValues . . movementCosts";
-	grid-template-columns: 120px 50px 55px 40px 45px;
+	grid-template-columns: 126px 49px 50px 45px 45px;
 	background: purple;
 	min-width: 300px;
 	margin-left: 6px;
@@ -776,87 +761,60 @@ select:focus + .focus {
 
 .item-characteristics-movement-abilities input[readonly] {
 	text-align: center;
-	padding-right: 2px;
-	border: none;
+	padding-right: 0px;
+	border: none; 
 	max-width: 45px;
 }
 
-.item-characteristics-movement-abilities label:nth-child(1) {
+.item-characteristics-movement-abilities h1 {
 	background: gold;
-	margin-left: 0px;
-	padding-left: 1px;
+	padding-left: 5px;
+	padding-right: 6px;
+	padding-top: 2px;
+	padding-bottom: 2px;
+	margin: 0px;
+	margin-top: 0px;
+	font-size: 13px;
+	font-style: normal;
+	line-height: 1.35;
 }
 
-.item-characteristics-movement-abilities label {
-	height: 20px;
-	line-height: 1.6;
-	margin: 0;
-	margin-left: 6px;
-}
-
-.item-characteristics-movement-abilities  label:nth-child(1) {
-	background: gold;
+.item-characteristics-movement-abilities h2 {
+	margin-left: 8px;
 }
 
 /* Sub-Item: combat abilities characteristics */
 .item-characteristics-movement-abilities-names {
 	grid-area: movementNames;
-}
-
-.item-characteristics-movement-abilities-names h1 {
-	background: gold;
-	margin-left: 0px;
-	padding-left: 2px;
-	padding-right: 50px;
-	padding-top: 2px;
-	padding-bottom: 1px;
-	margin: 0px;
-	margin-top: 1px;
-	font-size: 13px;
-	font-style: normal;
-	line-height: 1.35;
-	min-width: 120px;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
 }
 
 /* Sub-Item: core abilities values */
 .item-characteristics-movement-abilities-values {
 	grid-area: movementValues;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
 }
 
 .item-characteristics-movement-abilities-values h1 {
-	background: gold;
-	margin-left: 0px;
-	padding-left: 12px;
-	padding-right: 17px;
-	padding-top: 2px;
-	padding-bottom: 1px;
-	margin: 0px;
-	margin-top: 1px;
-	font-size: 13px;
-	font-style: normal;
-	line-height: 1.35;
-	min-width: 130px;
-	text-align: left;
+	min-width: 141px;
 }
 
 /* Sub-Item: core abilities costs */
 .item-characteristics-movement-abilities-costs {
 	grid-area: movementCosts;
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
 }
 
 .item-characteristics-movement-abilities-costs h1 {
-	background: gold;
-	margin-left: 0px;
-	padding-left: 20px;
-	padding-right: 5px;
-	padding-top: 2px;
-	padding-bottom: 1px;
-	margin: 0px;
-	margin-top: 1px;
-	font-size: 13px;
-	font-style: normal;
-	line-height: 1.35;
-	min-width: 31px;
+	margin-left: 8px;
+	text-align: left;
+	min-width: 32px;
 }
 
 /* characteristics tab right side */
@@ -1252,25 +1210,46 @@ select:focus + .focus {
 	min-width: 674px;
 }
 
-.grid-container-tab-options label {
+.grid-container-tab-options h1 {
 	font-size: 14px;
-	margin-left: 5px;
+	margin-left: 0px;
+	color: black;
+	padding-bottom: 5px;
+}
+
+.grid-container-tab-options label {
+	max-width: 13px;
+	padding: 8px;
 }
 
 /* Sub-Item: options */
 .item-options {
 	grid-area: options;
+	display: flex;
+	flex-direction: column;
+	justify-content: flex-start;
 	padding-left: 2px;
 	padding-top: 2px;
 	padding-bottom: 2px;
 	background-color: #fff990;
 	margin: 5px;
 	width: 450px;
+	max-height: 203px;
 	margin: 0px;
 	border: solid 2px goldenrod;
 	border-radius: 3px;
 }
 
+.item-options-row {
+	display: flex;
+	flex-direction: row;
+	justify-content: flex-start;
+	align-items: baseline;
+	min-width: 400px;
+	max-height: 28px;
+	margin-left: 10px;
+}
+
 /* --------------------------------------------------- */
 /* Custom buttons                                      */
 /* --------------------------------------------------- */
@@ -4250,7 +4229,8 @@ select:focus + .focus {
 .sheet-rolltemplate-custom-attack,
 .sheet-rolltemplate-custom-activate,
 .sheet-rolltemplate-custom-show {
-  margin-left: -37px;
+	margin-left: -37px;
+	color: #181818;
 }
 
 .withoutavatars .sheet-rolltemplate-custom,
@@ -4259,8 +4239,9 @@ select:focus + .focus {
 .withoutavatars .sheet-rolltemplate-custom-attack,
 .withoutavatars .sheet-rolltemplate-custom-activate,
 .withoutavatars .sheet-rolltemplate-custom-show {
-	  margin-left: -7px;
-	}
+	margin-left: -7px;
+	color: #181818;
+}
 
 .sheet-rolltemplate-custom .sheet-container,
 .sheet-rolltemplate-custom-normal-attack .sheet-container,
@@ -4420,4 +4401,4 @@ select:focus + .focus {
 	grid-column: span 2;
 	padding-right: 10px;
 	text-align: left;
-}
\ No newline at end of file
+}

From bb3502ace4115db131370efd8c35a472085203ca Mon Sep 17 00:00:00 2001
From: Villain1nGlasses <85969638+Villain1nGlasses@users.noreply.github.com>
Date: Mon, 7 Mar 2022 21:08:51 -0700
Subject: [PATCH 3/3] Small adjustment to characteristic spacing.

---
 HeroSystem6eHeroic/HeroSystem6eHeroic.css | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/HeroSystem6eHeroic/HeroSystem6eHeroic.css b/HeroSystem6eHeroic/HeroSystem6eHeroic.css
index da0f14da08..11581f4d8e 100644
--- a/HeroSystem6eHeroic/HeroSystem6eHeroic.css
+++ b/HeroSystem6eHeroic/HeroSystem6eHeroic.css
@@ -550,9 +550,10 @@ select:focus + .focus {
 	border-top: solid 1px goldenrod;
 	border-left: solid 1px goldenrod;
 	border-right: solid 1px goldenrod;
-	border-bottom: none;
+	border-bottom: 0px;
 	border-top-left-radius: 3px;
 	border-top-right-radius: 3px;
+	padding-bottom: 2px;
 }
 
 .item-characteristics-primary-attributes h1 {
@@ -665,6 +666,7 @@ select:focus + .focus {
 	border-left: solid 1px goldenrod;
 	border-bottom: none;
 	border-top: none;
+	padding-bottom: 2px;
 }
 
 .item-characteristics-combat-attributes input[type=number] {