diff --git a/MTG/index.html b/MTG/index.html
index 047f8bd..6d5f60f 100644
--- a/MTG/index.html
+++ b/MTG/index.html
@@ -151,10 +151,10 @@
                                                         </div>
                                             </div>
                                           <div id="buttonWrapper">
-                                                <div onclick="removePlayer()" id="removePlayer" class="buttons">−</div>
-                                            <div onclick="reset()" id="reset" class="buttons">↺<span class="buttonText"></span></div>
+                                                <div onclick="removePlayer()" id="removePlayer" class="buttons"><i class="fas fa-minus-circle"></i></div>
+                                            <div onclick="reset()" id="reset" class="buttons"><i class="fas fa-undo-alt"></i><span class="buttonText"></span></div>
                                             <!-- <div onclick="resetName()" id="reset" class="buttons">↻<span class="buttonText">reset name</span></div> -->
-                                            <div onclick="addPlayer()" id="addPlayer" class="buttons">+</div>
+                                            <div onclick="addPlayer()" id="addPlayer" class="buttons"><i class="fas fa-plus-circle"></i></div>
                                             </div>  
                                                                                                                                                 
                                             
diff --git a/MTG/style.css b/MTG/style.css
index 009d08c..dc12ec1 100644
--- a/MTG/style.css
+++ b/MTG/style.css
@@ -10,7 +10,7 @@ body {
   /* background-color: rgb(78, 69, 202); */
   background: rgb(2,0,36);
 background: radial-gradient(circle, rgba(2,0,36,1) 0%, rgba(137,137,194,1) 47%, rgba(108,127,131,1) 100%);
-  min-height: 100vh;
+  /* max-height: 100vh; */
   /* width: 100vw; */
   margin: 0;
   display: flex;
@@ -33,13 +33,13 @@ main {
     Verdana, sans-serif;
   flex-wrap: wrap;
   width: 100vw;
-  min-height: 100vh;
+  height: 100vh;
   /* align-items: center; */
   position: relative;
   /* margin: 0 auto; */
-  padding-bottom: 70px;
+  /* padding-bottom: 70px; */
   margin-top: 70px;
-  margin-bottom: -50px;
+  margin-bottom: -65px;
 }
 .name {
   font-size: 3rem;
@@ -97,6 +97,7 @@ main {
   min-width: auto;
   font-size: 6rem;
   user-select: none;
+  height:fit-content
 }
 
 .life div {
@@ -109,8 +110,10 @@ main {
   display: flex;
   flex-direction: column;
   /* flex-grow: 1; */
-  margin: 2rem;
+  margin: 1.5rem;
   gap: 0;
+  max-height: 300px !important;
+  
 }
 
 .buttons {
@@ -127,18 +130,21 @@ main {
   background-color: #eee;
   user-select: none;
   border-radius: 30px;
+  align-content: center;
 }
 #buttonWrapper {
   display: flex;
   flex-direction: row;
-  justify-content: space-evenly;
+  justify-content: space-between;
   width: 100%;
   position:absolute;
   bottom: 0;
   height:fit-content;
+  align-content: center;
 }
 .buttonText {
   font-size: 0.65rem;
+  
 }
 
 .fiveLife {