VERY SLIGHTLY minor fix for layout

index.html

@@ -470,18 +470,16 @@
                     </div>
 
         <div class="center">
-            <br>
             <button class = "button" id = "update-button" onclick = "updateStats()">
                 Update Stats
             </button>
             <button class = "button" id = "show-id-button" onclick = "toggleID()">
                 Edit IDs
             </button>
-            <br>
+        </div><br>
-        </div>
         <div class="id-box fade-in" id="id-edit" style="display: none">
             <div class="id-edit1">
-                <table class="white-space: nowrap">
+                <table>
                     <tr>
                         <th colspan="5">
                             <h1>Damage values:</h1>

styles.css

@@ -6,6 +6,7 @@
 .all {
     font-family: 'Nunito',sans-serif;
     font-weight: 700;
+    text-size-adjust: none;
 }
 
 th, td {
@@ -14,11 +15,9 @@ th, td {
 
 .nomargin {
     padding: 0px;
-}
-.nomarginp {
     margin: 0px;
-    padding: 0px;
 }
+
 div {
     padding: 0%;
 }
@@ -31,7 +30,11 @@ div {
     grid-template-rows: min-content min-content auto;
 }
 
-.skillpoints, .id-edit1 {
+.id-edit1 {
+
+}
+
+.skillpoints {
     padding: 0% 4% 2%;
     display: grid;
     grid-template-columns: repeat(5, 1fr);
@@ -39,14 +42,6 @@ div {
     grid-auto-rows: minmax(60px, auto);
 }
 
-.id-edit2 {
-    padding: 0% 4% 2%;
-    display: grid;
-    grid-template-columns: repeat(4, 1fr);
-    gap: 5px;
-    grid-auto-rows: minmax(60px, auto);
-}
-
 .powder-specials{
     padding: 0% 4% 2%;
     display: grid;
@@ -68,19 +63,11 @@ div {
 a.link{
     color: #A5FDFF;
 }
-.title{
-    text-align: center;
-    font-size: 150%;
-}
-.smalltitle{
-    text-align: center;
-    font-size: 125%;
-}
 .center {
     text-align: center;
     position: relative;
 }
-table.center{   
+table.center{
     margin: 10px;
     margin-left:auto;
     margin-right:auto;
@@ -95,19 +82,13 @@ table.center{
     text-align: left;
 }
 
-.build-helmet, .build-chestplate, .build-leggings, .build-boots, .build-ring1, .build-ring2, .build-bracelet, .build-necklace, .build-weapon, .build-order, .build-overall, .build-melee-stats, .build-defense-stats, .spell-info, .set-info, .powder-special, .powder-special-stats, .int-info, .id-box {
+.build-helmet, .build-chestplate, .build-leggings, .build-boots, .build-ring1, .build-ring2, .build-bracelet, .build-necklace, .build-weapon, .build-order, .build-overall, .build-melee-stats, .build-defense-stats, .spell-info, .set-info, .powder-special, .powder-special-stats, .int-info, .crafter, .recipe-stats, .craft-stats, .ing-stats, .id-box {
     color: #aaa;
     background: #121516;
     border: 3px solid #BCBCBC;
     border-radius: 3px;
     width: 96%;
 }
-.crafter, .recipe-stats, .craft-stats, .ing-stats {
-    color: #aaa;
-    background: #121516;
-    border: 3px solid #BCBCBC;
-    border-radius: 3px;
-}
 
 .spell-info {
     margin-bottom: 10px;
@@ -127,19 +108,23 @@ table.center{
     margin: 2px 2%;
     width: 94%;
     margin-bottom: 16px;
-    margin-left: auto;
-    margin-right: auto;
 }
+
 .itemp, .damagep {
     margin: 2px 2%;
     padding: 0;
 }
+.powderLeft {
+    margin: 2px 0% 2px 2%;
+    padding: 0;
+}
+.powderRight {
+    margin: 2px 2% 2px 0%;
+    padding: 0;
+}
 .space {
     margin-right: 5px;
 }
-.spaceleft{
-    margin-left: 5px;
-}
 
 .damageSubtitle {
     text-align: center;
@@ -204,8 +189,8 @@ table.center{
     margin: auto;
 }
 
-.idCenter {
+.idLeft {
-    text-align: center;
+    text-align: left;
     padding: 1em 0px 0px 0px;
     position: relative;
     display: flex;
@@ -219,7 +204,7 @@ table.center{
 ::-webkit-scrollbar {
     width: 10px;
   }
-  
+
 /* Track */
 ::-webkit-scrollbar-track {
     box-shadow: inset 0 0 5px #BCBCBC;
@@ -237,42 +222,9 @@ table.center{
 ::-webkit-scrollbar-corner{
     background: #110110;
 }
-.button-narrow {
-    background-color: #666; 
-    border: 2px solid #444;
-    border-radius: 5px;
-    color: #ddd;
-    text-align: center;
-    text-decoration: none;
-    font-family: 'Nunito',sans-serif;
-    font-weight: 700;
-    font-size: 90%;
-    display: inline-block;
-}
-button {
-    background-color: #666; 
-    border: 2px solid #444;
-    border-radius: 5px;
-    color: #ddd;
-    text-align: center;
-    text-decoration: none;
-    font-family: 'Nunito',sans-serif;
-    font-weight: 700;
-    font-size: 120%;
-    display: inline-block;
-}
-button:hover {
-    background-color: #556;
-}
 
-
-button:active {
-  background-color: #558;
-  box-shadow: 0 3px #666;
-  transform: translateY(1px);
-}
 input {
-    background-color: #666; 
+    background-color: #666;
     border: 2px solid #444;
     border-radius: 5px;
     color: #ddd;
@@ -304,12 +256,6 @@ input {
 .Mythic{
     color:#a0a;
 }
-.Crafted {
-    color: #0aa;
-}
-.Custom {
-    color: #0aa;
-}
 .Set{
     color:#5f5;
 }
@@ -319,7 +265,18 @@ input {
 
 button.toggleOn{
     background-color:#0a0;
-    border: 3 px solid rgb(0, 70, 0); 
+    border: 3 px solid rgb(0, 70, 0);
+}
+.toggleOn:hover {
+    background-color: #585;
+}
+button:hover {
+    background-color: #556;
+}
+button:active {
+  background-color: #558;
+  box-shadow: 0 3px #666;
+  transform: translateY(1px);
 }
 
 .funnynumber {
@@ -340,31 +297,7 @@ button.toggleOn{
     width: 100%;
 }
 
-.T0 {
+.hide-container-block, .hide-container-grid, .set-info-div, .fade-in, .misc {
-    color: #555;
-}
-.T1 {
-    color: #ff5;
-}
-.T2 {
-    color: #f5f;
-}
-.T3 {
-    color: #5ff;
-}
-.T0-bracket {
-    color: #555;
-}   
-.T1-bracket {
-    color: #fa0;
-}
-.T2-bracket {
-    color: #a0a;
-}
-.T3-bracket {
-    color: #0aa;
-}
-.hide-container-block, .hide-container-grid, .set-info-div, .fade-in {
     animation-duration: 0.5s;
     animation-name: fadeInFromNone;
     animation-fill-mode: forwards;
@@ -383,3 +316,8 @@ button.toggleOn{
         opacity: 1;
     }
 }
+
+.highlight {
+    color: #ff5;
+    background-color: #775;
+}