diff --git a/src/App.js b/src/App.js
index 2a6f97c..74a573a 100644
--- a/src/App.js
+++ b/src/App.js
@@ -94,27 +94,27 @@ function EditableBox(p) {
 }
 
 const CLASSES = {
-	HUNTER:{
+	Hunter:{
 		name:"Hunter",
 		icon:process.env.PUBLIC_URL+"/icons/UINGSClassHu.png"
 	},
-	FIGHTER:{
+	Fighter:{
 		name:"Fighter",
 		icon:process.env.PUBLIC_URL+"/icons/UINGSClassFi.png"
 	},
-	RANGER:{
+	Ranger:{
 		name:"Ranger",
 		icon:process.env.PUBLIC_URL+"/icons/UINGSClassRa.png"
 	},
-	GUNNER:{
+	Gunner:{
 		name:"Gunner",
 		icon:process.env.PUBLIC_URL+"/icons/UINGSClassGu.png"
 	},
-	FORCE:{
+	Force:{
 		name:"Force",
 		icon:process.env.PUBLIC_URL+"/icons/UINGSClassFo.png"
 	},
-	TECHTER:{
+	Techter:{
 		name:"Techter",
 		icon:process.env.PUBLIC_URL+"/icons/UINGSClassTe.png"
 	}
@@ -561,14 +561,29 @@ function TableEditor(p) {
 
 function DatabaseEditor(p) {
 	const [loading,setLoading] = useState(false)
+	const [message,setMessage] = useState(<span style={{color:"black"}}></span>)
 
 	return <>
 		{!loading?<>
-				<button className="basichover" style={{backgroundColor:"navy"}} onClick={()=>{setLoading(true)}}>Apply TEST Database to LIVE Database</button><br/><br/>
+				<button className="basichover" style={{backgroundColor:"navy"}} onClick={()=>{
+					setLoading(true)
+					setMessage(<span style={{color:"black"}}>Uploading Test Database to Production...</span>)
+					axios.post(p.BACKENDURL+"/databases/testtolive")
+					.then(()=>{
+						setMessage(<span style={{color:"green"}}>Success! Test Database is now live!</span>)
+					})
+					.catch((err)=>{
+						setMessage(<span style={{color:"red"}}>{err.message}</span>)
+					})
+					.then(()=>{
+						setLoading(false)
+					})
+				}}>Apply TEST Database to LIVE Database</button><br/><br/>
 				<button className="basichover" style={{backgroundColor:"maroon"}} onClick={()=>{setLoading(true)}}>Reset TEST database using current LIVE Database</button><br/><br/>
 				<button className="basichover" style={{backgroundColor:"darkgreen"}} onClick={()=>{setLoading(true)}}>Backup current TEST and LIVE Database</button><br/><br/>
 			</>:<img src={process.env.PUBLIC_URL+"/spinner.gif"} alt=""/>
 		}
+		{message}
 	</>
 }
 
@@ -755,11 +770,11 @@ function DamageCalculator(p) {
 	const [weaponTotalAtk,setWeaponTotalAtk] = useState(100)
 	
 		const [weaponBaseAtk,setWeaponBaseAtk] = useState(1)
-		const [weaponEnhanceLvl,setWeaponEnhanceLvl] = useState(1)
+		const [weaponEnhanceLv,setweaponEnhanceLv] = useState(1)
 
 	useEffect(()=>{
-		setWeaponTotalAtk(Number(weaponBaseAtk)+Number(weaponEnhanceLvl))
-	},[weaponBaseAtk,weaponEnhanceLvl])
+		setWeaponTotalAtk(Number(weaponBaseAtk)+Number(weaponEnhanceLv))
+	},[weaponBaseAtk,weaponEnhanceLv])
 
 	const [dmgVariance,setDmgVariance] = useState(1)
 
@@ -809,7 +824,7 @@ function DamageCalculator(p) {
 			Weapon Total Atk:<EditStatBox value={weaponTotalAtk} callback={(val)=>{setWeaponTotalAtk(val)}}/>
 			<ul>
 				<li>●Weapon Base Atk:<EditStatBox value={weaponBaseAtk} callback={(val)=>{setWeaponBaseAtk(val)}}/></li>
-				<li>●Weapon Enhance Lvl:<EditStatBox value={weaponEnhanceLvl} callback={(val)=>{setWeaponEnhanceLvl(val)}}/></li>
+				<li>●Weapon Enhance Lv:<EditStatBox value={weaponEnhanceLv} callback={(val)=>{setweaponEnhanceLv(val)}}/></li>
 			</ul>
 			<br/><br/><br/>
 			Damage Variance:<EditStatBox value={dmgVariance} callback={(val)=>{setDmgVariance(val)}}/>
@@ -857,6 +872,9 @@ function App() {
 	const [buildName,setBuildName] = useState("Fatimah")
 	const [className,setClassName] = useState("Ranger")
 	const [secondaryClassName,setSecondaryClassName] = useState("Force")
+	const [classLv,setClassLv] = useState(20)
+	const [secondaryClassLv,setSecondaryClassLv] = useState(15)
+		
 	
 	const [bp,setBP] = useState(1330)
 	const [hp,setHP] = useState(388)
@@ -944,7 +962,9 @@ function App() {
 					author={author} 
 					buildName={buildName} 
 					className={className} 
-					secondaryClassName={secondaryClassName} 
+					secondaryClassName={secondaryClassName}
+					classLv={classLv} 
+					secondaryClassLv={secondaryClassLv} 
 					bp={bp} 
 					hp={hp} 
 					pp={pp} 
diff --git a/src/TestPanel.js b/src/TestPanel.js
index 3dcecfc..3aa47a8 100644
--- a/src/TestPanel.js
+++ b/src/TestPanel.js
@@ -43,7 +43,7 @@ useEffect(()=>{
   }
 },[p.bp]) 
 
-console.log(p.GetData("class",p.className,"icon"))
+//console.log(p.GetData("class",p.className,"icon"))
 
     return ( //Futasuke is a genius
 <div className="main">
@@ -66,12 +66,12 @@ console.log(p.GetData("class",p.className,"icon"))
   <tr>
     <td>Class</td>
     <td>
-    <img alt="" src={process.env.PUBLIC_URL+p.GetData("class",p.className,"icon")} />{p.className}<br />
-    <img alt="" src="Fo.png" /> Force 
+    <img alt="" src={process.env.PUBLIC_URL+p.GetData("class",p.className,"icon")} /> {p.className}<br />
+    <img alt="" src={process.env.PUBLIC_URL+p.GetData("class",p.secondaryClassName,"icon")} /> {p.secondaryClassName} 
     </td>
     <td>
-    <span className="ye">Lv.20</span><br />
-    Lv.15
+    <span className="ye">Lv.{p.classLv}</span><br />
+    Lv.{p.secondaryClassLv}
     </td>
   </tr>
 </table>
@@ -168,43 +168,46 @@ console.log(p.GetData("class",p.className,"icon"))
   <tr>
     <td>Battle Power</td>
 	<td>{p.bp}</td>
-  <td><div className="barGraph"><span className="barOverlay" style={{background:"linear-gradient(90deg,transparent 0% "+((p.bp/bpGraphMax)*100)+"%,black "+((p.bp/bpGraphMax)*100)+"%)"}}>&nbsp;</span></div></td>
+  <td colspan="2"><div className="barGraph"><span className="barOverlay" style={{background:"linear-gradient(90deg,transparent 0% "+((p.bp/bpGraphMax)*100)+"%,black "+((p.bp/bpGraphMax)*100)+"%)"}}>&nbsp;</span></div></td>
   </tr>
   <tr>
     <td>HP</td>
 	<td>{p.hp}</td>
-  <td><div className="barGraph"><span className="barOverlay" style={{background:"linear-gradient(90deg,transparent 0% "+((p.hp/hpGraphMax)*100)+"%,black "+((p.hp/hpGraphMax)*100)+"%)"}}>&nbsp;</span></div></td>
+  <td colspan="2"><div className="barGraph"><span className="barOverlay" style={{background:"linear-gradient(90deg,transparent 0% "+((p.hp/hpGraphMax)*100)+"%,black "+((p.hp/hpGraphMax)*100)+"%)"}}>&nbsp;</span></div></td>
   </tr>
   <tr>
     <td>PP</td>
     <td>{p.pp}</td>
-    <td><div className="barGraph"><span className="barOverlay" style={{background:"linear-gradient(90deg,transparent 0% "+((p.pp/ppGraphMax)*100)+"%,black "+((p.pp/ppGraphMax)*100)+"%)"}}>&nbsp;</span></div></td>
+    <td colspan="2"><div className="barGraph"><span className="barOverlay" style={{background:"linear-gradient(90deg,transparent 0% "+((p.pp/ppGraphMax)*100)+"%,black "+((p.pp/ppGraphMax)*100)+"%)"}}>&nbsp;</span></div></td>
   </tr>
   <tr>
     <td>Attack</td>
     <td>{p.statDisplayAtk}</td>
-    <td><div className="barGraph"><span className="barOverlay" style={{background:"linear-gradient(90deg,transparent 0% "+((p.statDisplayAtk/atkGraphMax)*100)+"%,black "+((p.statDisplayAtk/atkGraphMax)*100)+"%)"}}>&nbsp;</span></div></td>
+    <td colspan="2"><div className="barGraph"><span className="barOverlay" style={{background:"linear-gradient(90deg,transparent 0% "+((p.statDisplayAtk/atkGraphMax)*100)+"%,black "+((p.statDisplayAtk/atkGraphMax)*100)+"%)"}}>&nbsp;</span></div></td>
   </tr>
    <tr>
     <td>Defense</td>
     <td>{p.def}</td>
-    <td><div className="barGraph"><span className="barOverlay" style={{background:"linear-gradient(90deg,transparent 0% "+((p.def/defGraphMax)*100)+"%,black "+((p.def/defGraphMax)*100)+"%)"}}>&nbsp;</span></div></td>
+    <td colspan="2"><div className="barGraph"><span className="barOverlay" style={{background:"linear-gradient(90deg,transparent 0% "+((p.def/defGraphMax)*100)+"%,black "+((p.def/defGraphMax)*100)+"%)"}}>&nbsp;</span></div></td>
   </tr>
    <tr>
     <td>Weapon Up</td>
-    <td className="statsMelWeaponUp"><span className="ye">+{(p.weaponUp1*100).toFixed(1)}%</span><br />
-    <span className="ye">+{(p.weaponUp3*100).toFixed(1)}%</span></td>
-    <td className="statsRngWeaponUp"><span className="ye">+{(p.weaponUp2*100).toFixed(1)}%</span></td>
+    <td><img alt="" src={process.env.PUBLIC_URL+"/icons/mel.png"} /><span className="ye">&nbsp;+{(p.weaponUp1*100).toFixed(1)}%</span><br />
+    <img alt="" src={process.env.PUBLIC_URL+"/icons/tec.png"} /><span className="ye">&nbsp;+{(p.weaponUp3*100).toFixed(1)}%</span></td>
+    <td><img alt="" src={process.env.PUBLIC_URL+"/icons/rng.png"} /><span className="ye">&nbsp;+{(p.weaponUp2*100).toFixed(1)}%</span></td>
+    <td>&nbsp;</td>
   </tr>
   <tr>
     <td>Ailment Resist.</td>
     <td>{p.damageResist}</td>
     <td>&nbsp;</td>
+    <td>&nbsp;</td>
 </tr>
     <tr>
     <td>Damage Resist.</td>
     <td>{p.damageResist}</td>
     <td>&nbsp;</td>
+    <td>&nbsp;</td>
 </tr>
 </table>
 </div>
diff --git a/src/style.css b/src/style.css
index 60cd5fd..326432c 100644
--- a/src/style.css
+++ b/src/style.css
@@ -196,30 +196,17 @@ em {
 }
 .statsInfo {
 	table-layout:fixed;
+	width: 100%;
+	line-height: 23px;
 }
 .statsInfo td:nth-child(2) {
 	text-align: right;
 }
-.statsInfo td:last-child {
-	min-width: 55%;
+.statsInfo td:nth-child(3) {
+	width: 50%;
 }
 .statsInfo span {
 
-}
-.statsMelWeaponUp:before {
-	content: url("./icons/mel.png");
-	margin-right: 5px;
-	vertical-align: middle;
-}
-.statsRngWeaponUp:before  {
-	content: url("./icons/rng.png");
-	margin-right: 5px;
-	vertical-align: middle;
-}
-.statsTecWeaponUp:before  {
-	content: url("./icons/tec.png");
-	margin-right: 5px;
-	vertical-align: middle;
 }
 .boxTitleBar {
 	/* background-color: #495a61; */
@@ -273,6 +260,9 @@ em {
 .da span:hover {
 	background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66));
 }
+.basicInfo {
+	line-height: 23px;
+}
 .basicInfo tr:hover {
 	background: linear-gradient(45deg,rgba(76,113,126,0.66),rgba(113,169,189,00.66));	
 }