wynnbuilder-forked-for-changes/customizer.html
2021-03-16 21:19:19 -07:00

1890 lines
161 KiB
HTML

<!DOCTYPE html>
<html scroll-behavior="smooth">
<head>
<meta charset="UTF-8" />
<!-- nunito font, copying wynndata -->
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Nunito&display=swap" rel="stylesheet">
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" media="screen and (min-width: 800px)" href="customwide.css"/>
<link rel="stylesheet" media="screen and (max-width: 799px)" href="customnarrow.css"/>
<link rel="icon" href="./media/icons/custom.png">
<link rel="manifest" href="manifest.json">
<title>WynnCustom</title>
</head>
<body class="all">
<div class="center">
<header class = "header nomarginp">
<div class = "headerleft" id = "headerleft">
</div>
<div class = "headercenter" id = "headercenter">
<div>
<p class = "itemp" id = "header">WynnCustom</p>
</div>
</div>
<div class = "headerright" id = "headerright">
</div>
</header>
</div>
<div class = "center overall-container" display = "grid">
<div class = "customchoices" display = "grid" style = "grid-item-1">
<div class = "choiceblock container" style = "grid-item-1">
<table>
<p class = "center smalltitle">Info</p>
<tr>
<td class="left" id = "name">
<label for="name-choice">Name:</label><br/>
<input class="string-input" id="name-choice" name="name-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "lore">
<label for="name-choice">Lore:</label><br/>
<input class="string-input" id="lore-choice" name="lore-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "type">
<label for="tier-choice">Type:</label><br/>
<input class="string-input" list="type-list" id="type-choice" name="type-choice" value="" placeholder="Helmet" tabindex=""/>
<datalist id = "type-list">
</datalist>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "lvl">
<label for="tier-choice">Level:</label><br/>
<input class="number-input" id="lvl-choice" name="lvl-choice" value="" placeholder="1" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "tier">
<label for="tier-choice">Tier:</label><br/>
<input class="string-input" list="tier-list" id="tier-choice" name="tier-choice" value="" placeholder="Normal" tabindex=""/>
<datalist id = "tier-list">
</datalist>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "slots">
<label for="slots-choice">Powder Slots:</label><br/>
<input class="number-input" id="slots-choice" name="slots-choice" value="" placeholder="0" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "majorIds">
<label for="majorIds-choice">Major ID:</label><br/>
<input class="string-input" id="majorIds-choice" name="majorIds-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="center">
<p class = "center">Requirements</p>
</td>
</tr>
<tr>
<td class="left" id = "classReq">
<label for="classReq-choice">Class Requirement:</label><br/>
<input class="string-input" list = "class-list" id="classReq-choice" name="classReq-choice" value="" tabindex=""/>
<datalist id = "class-list">
</datalist>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "quest">
<label for="quest-choice">Quest Requirement:</label><br/>
<input class="string-input" id="quest-choice" name="quest-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "strReq">
<label for="strReq-choice">Strength Requirement:</label><br/>
<input class="number-input" id="strReq-choice" name="strReq-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "dexReq">
<label for="dexReq-choice">Dexterity Requirement:</label><br/>
<input class="number-input" id="dexReq-choice" name="dexReq-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "intReq">
<label for="intReq-choice">Intelligence Requirement:</label><br/>
<input class="number-input" id="intReq-choice" name="intReq-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "defReq">
<label for="defReq-choice">Defense Requirement:</label><br/>
<input class="number-input" id="defReq-choice" name="defReq-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "agiReq">
<label for="agiReq-choice">Agility Requirement:</label><br/>
<input class="number-input" id="agiReq-choice" name="agiReq-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class = "left">
<p class = "center">Extra</p>
</td>
</tr>
<tr>
<td class="left" id = "neg_roll_range">
<label for="neg_roll_range-choice">Neg. Roll Range ([a,b]*base):</label><br/>
<table id = "neg_roll_range-choice">
<tr>
<td>
<input class="small-input" id="neg_roll_range-choice-min" name="neg_roll_range-choice-min" value="" placeholder="min" tabindex=""/>
</td>
<td>
<input class="small-input" id="neg_roll_range-choice-max" name="neg_roll_range-choice-max" value="" placeholder="max" tabindex=""/>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "pos_roll_range">
<label for="pos_roll_range-choice">Pos. Roll Range ([a,b]*base):</label><br/>
<table id = "pos_roll_range-choice">
<tr>
<td>
<input class="small-input" id="pos_roll_range-choice-min" name="pos_roll_range-choice-min" value="" placeholder="min" tabindex=""/>
</td>
<td>
<input class="small-input" id="pos_roll_range-choice-max" name="pos_roll_range-choice-max" value="" placeholder="max" tabindex=""/>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td>
<button id = "reset-roll-range-button" onclick = "resetBaseValues()">Reset Roll Bases</button>
</td>
</tr>
</table>
</div>
<div class = "choiceblock container" style = "grid-item-2">
<table>
<p class = "center smalltitle">Static Stats</p>
<tr>
<td class="left" id = "str">
<label for="str-choice">Strength:</label><br/>
<input class="number-input" id="str-choice" name="str-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "dex">
<label for="dex-choice">Dexterity:</label><br/>
<input class="number-input" id="dex-choice" name="dex-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "int">
<label for="int-choice">Intelligence:</label><br/>
<input class="number-input" id="int-choice" name="int-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "def">
<label for="def-choice">Defense:</label><br/>
<input class="number-input" id="def-choice" name="def-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "agi">
<label for="agi-choice">Agility:</label><br/>
<input class="number-input" id="agi-choice" name="agi-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class = "left">
<p class = "center">Weapon Stats</p>
</td>
</tr>
<tr>
<td class="left" id = "nDam">
<label for="nDam-choice">Neutral Damage:</label><br/>
<input class="string-input" id="nDam-choice" name="nDam-choice" value="" placeholder="0-0" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "eDam">
<label for="eDam-choice">Earth Damage:</label><br/>
<input class="string-input" id="eDam-choice" name="eDam-choice" value="" placeholder="0-0" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "tDam">
<label for="tDam-choice">Thunder Damage:</label><br/>
<input class="string-input" id="tDam-choice" name="tDam-choice" value="" placeholder="0-0" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "wDam">
<label for="wDam-choice">Water Damage:</label><br/>
<input class="string-input" id="wDam-choice" name="wDam-choice" value="" placeholder="0-0" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "fDam">
<label for="fDam-choice">Fire Damage:</label><br/>
<input class="string-input" id="fDam-choice" name="fDam-choice" value="" placeholder="0-0" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "aDam">
<label for="aDam-choice">Air Damage:</label><br/>
<input class="string-input" id="aDam-choice" name="aDam-choice" value="" placeholder="0-0" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "atkSpd">
<label for="atkspd-choice">Attack Speed:</label><br/>
<input class="string-input" list="atkSpd-list" id="atkSpd-choice" name="atkSpd-choice" value="" placeholder = "NORMAL" tabindex=""/>
<datalist id = "atkSpd-list">
</datalist>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class = "left">
<p class = "center">Armor/Accessory Stats</p>
</td>
</tr>
<tr>
<td class="left" id = "hp">
<label for="hp-choice">Health:</label><br/>
<input class="number-input" id="hp-choice" name="hp-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "eDef">
<label for="eDef-choice">Earth Defense:</label><br/>
<input class="number-input" id="eDef-choice" name="eDef-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "tDef">
<label for="tDef-choice">Thunder Defense:</label><br/>
<input class="number-input" id="tDef-choice" name="tDef-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "wDef">
<label for="wDef-choice">Water Defense:</label><br/>
<input class="number-input" id="wDef-choice" name="wDef-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "fDef">
<label for="fDef-choice">Fire Defense:</label><br/>
<input class="number-input" id="fDef-choice" name="fDef-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "aDef">
<label for="aDef-choice">Air Defense:</label><br/>
<input class="number-input" id="aDef-choice" name="aDef-choice" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class = "left">
<p class = "center">Consumable Stats</p>
</td>
</tr>
<tr>
<td class="left" id = "durability">
<label for="durability-choice">Durability (a-b):</label><br/>
<input class="array-input small-input" id="durability-choice" name="durability-choice" value="" placeholder="0-0" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "duration">
<label for="duration-choice">Duration (a-b):</label><br/>
<input class="array-input small-input" id="duration-choice" name="duration-choice" value="" placeholder="0-0" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
<tr>
<td class="left" id = "charges">
<label for="duration-choice">Charges:</label><br/>
<input class="number-input small-input" id="charges-choice" name="charges-choice" value="" placeholder="0" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
</div>
<div class = "choiceblock container" style = "grid-item-3">
<table>
<p class = "center smalltitle">Variable Stats</p>
<tr>
<td class="left">
<p class="center">Damage Stats</p>
</td>
</tr>
<tr>
<td class="left" id = "eDamPct">
<div id="eDamPct-choice-fixed-container" style = "display:none" >
<label for="eDamPct-choice-fixed">Earth Damage %:</label><br/>
<input class="number-input" id="eDamPct-choice-fixed" name="eDamPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="eDamPct-choice-container">
<label for = "eDamPct-choice">Earth Damage %:</label><br/>
<table id = "eDamPct-choice">
<tr>
<td>
<label for="eDamPct-choice-base">base:</label>
<input class="number-input small-input" id="eDamPct-choice-base" name="eDamPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="eDamPct-choice-min">min:</label>
<input class="number-input small-input" id="eDamPct-choice-min" name="eDamPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="eDamPct-choice-max">max:</label>
<input class="number-input small-input" id="eDamPct-choice-max" name="eDamPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "tDamPct">
<div id="tDamPct-choice-fixed-container" style = "display:none" >
<label for="tDamPct-choice-fixed">Thunder Damage %:</label><br/>
<input class="number-input" id="tDamPct-choice-fixed" name="tDamPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="tDamPct-choice-container">
<label for = "tDamPct-choice">Thunder Damage %:</label><br/>
<table id = "tDamPct-choice">
<tr>
<td>
<label for="tDamPct-choice-base">base:</label>
<input class="number-input small-input" id="tDamPct-choice-base" name="tDamPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="tDamPct-choice-min">min:</label>
<input class="number-input small-input" id="tDamPct-choice-min" name="tDamPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="tDamPct-choice-max">max:</label>
<input class="number-input small-input" id="tDamPct-choice-max" name="tDamPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "wDamPct">
<div id="wDamPct-choice-fixed-container" style = "display:none" >
<label for="wDamPct-choice-fixed">Water Damage %:</label><br/>
<input class="number-input" id="wDamPct-choice-fixed" name="wDamPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="wDamPct-choice-container">
<label for = "wDamPct-choice">Water Damage %:</label><br/>
<table id = "wDamPct-choice">
<tr>
<td>
<label for="wDamPct-choice-base">base:</label>
<input class="number-input small-input" id="wDamPct-choice-base" name="wDamPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="wDamPct-choice-min">min:</label>
<input class="number-input small-input" id="wDamPct-choice-min" name="wDamPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="wDamPct-choice-max">max:</label>
<input class="number-input small-input" id="wDamPct-choice-max" name="wDamPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "fDamPct">
<div id="fDamPct-choice-fixed-container" style = "display:none" >
<label for="fDamPct-choice-fixed">Fire Damage %:</label><br/>
<input class="number-input" id="fDamPct-choice-fixed" name="fDamPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="fDamPct-choice-container">
<label for = "fDamPct-choice">Fire Damage %:</label><br/>
<table id = "fDamPct-choice">
<tr>
<td>
<label for="fDamPct-choice-base">base:</label>
<input class="number-input small-input" id="fDamPct-choice-base" name="fDamPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="fDamPct-choice-min">min:</label>
<input class="number-input small-input" id="fDamPct-choice-min" name="fDamPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="fDamPct-choice-max">max:</label>
<input class="number-input small-input" id="fDamPct-choice-max" name="fDamPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "aDamPct">
<div id="aDamPct-choice-fixed-container" style = "display:none" >
<label for="aDamPct-choice-fixed">Air Damage %:</label><br/>
<input class="number-input" id="aDamPct-choice-fixed" name="aDamPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="aDamPct-choice-container">
<label for = "aDamPct-choice">Air Damage %:</label><br/>
<table id = "aDamPct-choice">
<tr>
<td>
<label for="aDamPct-choice-base">base:</label>
<input class="number-input small-input" id="aDamPct-choice-base" name="aDamPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="aDamPct-choice-min">min:</label>
<input class="number-input small-input" id="aDamPct-choice-min" name="aDamPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="aDamPct-choice-max">max:</label>
<input class="number-input small-input" id="aDamPct-choice-max" name="aDamPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "mdPct">
<div id="mdPct-choice-fixed-container" style = "display:none" >
<label for="mdPct-choice-fixed">Melee Damage %:</label><br/>
<input class="number-input" id="mdPct-choice-fixed" name="mdPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="mdPct-choice-container">
<label for = "mdPct-choice">Melee Damage %:</label><br/>
<table id = "mdPct-choice">
<tr>
<td>
<label for="mdPct-choice-base">base:</label>
<input class="number-input small-input" id="mdPct-choice-base" name="mdPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="mdPct-choice-min">min:</label>
<input class="number-input small-input" id="mdPct-choice-min" name="mdPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="mdPct-choice-max">max:</label>
<input class="number-input small-input" id="mdPct-choice-max" name="mdPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "mdRaw">
<div id="mdRaw-choice-fixed-container" style = "display:none" >
<label for="mdRaw-choice-fixed">Raw Melee Damage:</label><br/>
<input class="number-input" id="mdRaw-choice-fixed" name="mdRaw-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="mdRaw-choice-container">
<label for = "mdRaw-choice">Raw Melee Damage:</label><br/>
<table id = "mdRaw-choice">
<tr>
<td>
<label for="mdRaw-choice-base">base:</label>
<input class="number-input small-input" id="mdRaw-choice-base" name="mdRaw-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="mdRaw-choice-min">min:</label>
<input class="number-input small-input" id="mdRaw-choice-min" name="mdRaw-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="mdRaw-choice-max">max:</label>
<input class="number-input small-input" id="mdRaw-choice-max" name="mdRaw-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "sdPct">
<div id="sdPct-choice-fixed-container" style = "display:none" >
<label for="sdPct-choice-fixed">Spell Damage %:</label><br/>
<input class="number-input" id="sdPct-choice-fixed" name="sdPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="sdPct-choice-container">
<label for = "sdPct-choice">Spell Damage %:</label><br/>
<table id = "sdPct-choice">
<tr>
<td>
<label for="sdPct-choice-base">base:</label>
<input class="number-input small-input" id="sdPct-choice-base" name="sdPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="sdPct-choice-min">min:</label>
<input class="number-input small-input" id="sdPct-choice-min" name="sdPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="sdPct-choice-max">max:</label>
<input class="number-input small-input" id="sdPct-choice-max" name="sdPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "sdRaw">
<div id="sdRaw-choice-fixed-container" style = "display:none" >
<label for="sdRaw-choice-fixed">Raw Spell Damage:</label><br/>
<input class="number-input" id="sdRaw-choice-fixed" name="sdRaw-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="sdRaw-choice-container">
<label for = "sdRaw-choice">Raw Spell Damage:</label><br/>
<table id = "sdRaw-choice">
<tr>
<td>
<label for="sdRaw-choice-base">base:</label>
<input class="number-input small-input" id="sdRaw-choice-base" name="sdRaw-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="sdRaw-choice-min">min:</label>
<input class="number-input small-input" id="sdRaw-choice-min" name="sdRaw-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="sdRaw-choice-max">max:</label>
<input class="number-input small-input" id="sdRaw-choice-max" name="sdRaw-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "atkTier">
<div id="atkTier-choice-fixed-container" style = "display:none" >
<label for="atkTier-choice-fixed">Attack Speed Bonus:</label><br/>
<input class="number-input" id="atkTier-choice-fixed" name="atkTier-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="atkTier-choice-container">
<label for = "atkTier-choice">Attack Speed Bonus:</label><br/>
<table id = "atkTier-choice">
<tr>
<td>
<label for="atkTier-choice-base">base:</label>
<input class="number-input small-input" id="atkTier-choice-base" name="atkTier-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="atkTier-choice-min">min:</label>
<input class="number-input small-input" id="atkTier-choice-min" name="atkTier-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="atkTier-choice-max">max:</label>
<input class="number-input small-input" id="atkTier-choice-max" name="atkTier-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "poison">
<div id="poison-choice-fixed-container" style = "display:none" >
<label for="poison-choice-fixed">Poison ( /3s):</label><br/>
<input class="number-input" id="poison-choice-fixed" name="poison-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="poison-choice-container">
<label for = "poison-choice">Poison ( /3s):</label><br/>
<table id = "poison-choice">
<tr>
<td>
<label for="poison-choice-base">base:</label>
<input class="number-input small-input" id="poison-choice-base" name="poison-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="poison-choice-min">min:</label>
<input class="number-input small-input" id="poison-choice-min" name="poison-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="poison-choice-max">max:</label>
<input class="number-input small-input" id="poison-choice-max" name="poison-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class = "left">
<p class = "center">Defensive Stats</p>
</td>
</tr>
<tr>
<td class="left" id = "hpBonus">
<div id="hpBonus-choice-fixed-container" style = "display:none" >
<label for="hpBonus-choice-fixed">Health Bonus:</label><br/>
<input class="number-input" id="hpBonus-choice-fixed" name="hpBonus-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="hpBonus-choice-container">
<label for = "hpBonus-choice">Health Bonus:</label><br/>
<table id = "hpBonus-choice">
<tr>
<td>
<label for="hpBonus-choice-base">base:</label>
<input class="number-input small-input" id="hpBonus-choice-base" name="hpBonus-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="hpBonus-choice-min">min:</label>
<input class="number-input small-input" id="hpBonus-choice-min" name="hpBonus-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="hpBonus-choice-max">max:</label>
<input class="number-input small-input" id="hpBonus-choice-max" name="hpBonus-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "eDefPct">
<div id="eDefPct-choice-fixed-container" style = "display:none" >
<label for="eDefPct-choice-fixed">Earth Defense %:</label><br/>
<input class="number-input" id="eDefPct-choice-fixed" name="eDefPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="eDefPct-choice-container">
<label for = "eDefPct-choice">Earth Defense %:</label><br/>
<table id = "eDefPct-choice">
<tr>
<td>
<label for="eDefPct-choice-base">base:</label>
<input class="number-input small-input" id="eDefPct-choice-base" name="eDefPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="eDefPct-choice-min">min:</label>
<input class="number-input small-input" id="eDefPct-choice-min" name="eDefPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="eDefPct-choice-max">max:</label>
<input class="number-input small-input" id="eDefPct-choice-max" name="eDefPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "tDefPct">
<div id="tDefPct-choice-fixed-container" style = "display:none" >
<label for="tDefPct-choice-fixed">Thunder Defense %:</label><br/>
<input class="number-input" id="tDefPct-choice-fixed" name="tDefPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="tDefPct-choice-container">
<label for = "tDefPct-choice">Thunder Defense %:</label><br/>
<table id = "tDefPct-choice">
<tr>
<td>
<label for="tDefPct-choice-base">base:</label>
<input class="number-input small-input" id="tDefPct-choice-base" name="tDefPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="tDefPct-choice-min">min:</label>
<input class="number-input small-input" id="tDefPct-choice-min" name="tDefPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="tDefPct-choice-max">max:</label>
<input class="number-input small-input" id="tDefPct-choice-max" name="tDefPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "wDefPct">
<div id="wDefPct-choice-fixed-container" style = "display:none" >
<label for="wDefPct-choice-fixed">Water Defense %:</label><br/>
<input class="number-input" id="wDefPct-choice-fixed" name="wDefPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="wDefPct-choice-container">
<label for = "wDefPct-choice">Water Defense %:</label><br/>
<table id = "wDefPct-choice">
<tr>
<td>
<label for="wDefPct-choice-base">base:</label>
<input class="number-input small-input" id="wDefPct-choice-base" name="wDefPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="wDefPct-choice-min">min:</label>
<input class="number-input small-input" id="wDefPct-choice-min" name="wDefPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="wDefPct-choice-max">max:</label>
<input class="number-input small-input" id="wDefPct-choice-max" name="wDefPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "fDefPct">
<div id="fDefPct-choice-fixed-container" style = "display:none" >
<label for="fDefPct-choice-fixed">Fire Defense %:</label><br/>
<input class="number-input" id="fDefPct-choice-fixed" name="fDefPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="fDefPct-choice-container">
<label for = "fDefPct-choice">Fire Defense %:</label><br/>
<table id = "fDefPct-choice">
<tr>
<td>
<label for="fDefPct-choice-base">base:</label>
<input class="number-input small-input" id="fDefPct-choice-base" name="fDefPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="fDefPct-choice-min">min:</label>
<input class="number-input small-input" id="fDefPct-choice-min" name="fDefPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="fDefPct-choice-max">max:</label>
<input class="number-input small-input" id="fDefPct-choice-max" name="fDefPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "aDefPct">
<div id="aDefPct-choice-fixed-container" style = "display:none" >
<label for="aDefPct-choice-fixed">Air Defense %:</label><br/>
<input class="number-input" id="aDefPct-choice-fixed" name="aDefPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="aDefPct-choice-container">
<label for = "aDefPct-choice">Air Defense %:</label><br/>
<table id = "aDefPct-choice">
<tr>
<td>
<label for="aDefPct-choice-base">base:</label>
<input class="number-input small-input" id="aDefPct-choice-base" name="aDefPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="aDefPct-choice-min">min:</label>
<input class="number-input small-input" id="aDefPct-choice-min" name="aDefPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="aDefPct-choice-max">max:</label>
<input class="number-input small-input" id="aDefPct-choice-max" name="aDefPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "hprPct">
<div id="hprPct-choice-fixed-container" style = "display:none" >
<label for="hprPct-choice-fixed">Health Regen %:</label><br/>
<input class="number-input" id="hprPct-choice-fixed" name="hprPct-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="hprPct-choice-container">
<label for = "hprPct-choice">Health Regen %:</label><br/>
<table id = "hprPct-choice">
<tr>
<td>
<label for="hprPct-choice-base">base:</label>
<input class="number-input small-input" id="hprPct-choice-base" name="hprPct-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="hprPct-choice-min">min:</label>
<input class="number-input small-input" id="hprPct-choice-min" name="hprPct-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="hprPct-choice-max">max:</label>
<input class="number-input small-input" id="hprPct-choice-max" name="hprPct-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "hprRaw">
<div id="hprRaw-choice-fixed-container" style = "display:none" >
<label for="hprRaw-choice-fixed">Raw Health Regen:</label><br/>
<input class="number-input" id="hprRaw-choice-fixed" name="hprRaw-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="hprRaw-choice-container">
<label for = "hprRaw-choice">Raw Health Regen:</label><br/>
<table id = "hprRaw-choice">
<tr>
<td>
<label for="hprRaw-choice-base">base:</label>
<input class="number-input small-input" id="hprRaw-choice-base" name="hprRaw-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="hprRaw-choice-min">min:</label>
<input class="number-input small-input" id="hprRaw-choice-min" name="hprRaw-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="hprRaw-choice-max">max:</label>
<input class="number-input small-input" id="hprRaw-choice-max" name="hprRaw-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class = "left">
<p class = "center">Utility</p>
</td>
</tr>
<tr>
<td class="left" id = "mr">
<div id="mr-choice-fixed-container" style = "display:none" >
<label for="mr-choice-fixed">Mana Regen ( /4s):</label><br/>
<input class="number-input" id="mr-choice-fixed" name="mr-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="mr-choice-container">
<label for = "mr-choice">Mana Regen ( /4s):</label><br/>
<table id = "mr-choice">
<tr>
<td>
<label for="mr-choice-base">base:</label>
<input class="number-input small-input" id="mr-choice-base" name="mr-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="mr-choice-min">min:</label>
<input class="number-input small-input" id="mr-choice-min" name="mr-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="mr-choice-max">max:</label>
<input class="number-input small-input" id="mr-choice-max" name="mr-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "ms">
<div id="ms-choice-fixed-container" style = "display:none" >
<label for="ms-choice-fixed">Mana Steal ( /4s):</label><br/>
<input class="number-input" id="ms-choice-fixed" name="ms-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="ms-choice-container">
<label for = "ms-choice">Mana Steal ( /4s):</label><br/>
<table id = "ms-choice">
<tr>
<td>
<label for="ms-choice-base">base:</label>
<input class="number-input small-input" id="ms-choice-base" name="ms-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="ms-choice-min">min:</label>
<input class="number-input small-input" id="ms-choice-min" name="ms-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="ms-choice-max">max:</label>
<input class="number-input small-input" id="ms-choice-max" name="ms-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "ls">
<div id="ls-choice-fixed-container" style = "display:none" >
<label for="ls-choice-fixed">Life Steal ( /4s):</label><br/>
<input class="number-input" id="ls-choice-fixed" name="ls-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="ls-choice-container">
<label for = "ls-choice">Life Steal ( /4s):</label><br/>
<table id = "ls-choice">
<tr>
<td>
<label for="ls-choice-base">base:</label>
<input class="number-input small-input" id="ls-choice-base" name="ls-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="ls-choice-min">min:</label>
<input class="number-input small-input" id="ls-choice-min" name="ls-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="ls-choice-max">max:</label>
<input class="number-input small-input" id="ls-choice-max" name="ls-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "thorns">
<div id="thorns-choice-fixed-container" style = "display:none" >
<label for="thorns-choice-fixed">Thorns Chance %:</label><br/>
<input class="number-input" id="thorns-choice-fixed" name="thorns-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="thorns-choice-container">
<label for = "thorns-choice">Thorns Chance %:</label><br/>
<table id = "thorns-choice">
<tr>
<td>
<label for="thorns-choice-base">base:</label>
<input class="number-input small-input" id="thorns-choice-base" name="thorns-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="thorns-choice-min">min:</label>
<input class="number-input small-input" id="thorns-choice-min" name="thorns-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="thorns-choice-max">max:</label>
<input class="number-input small-input" id="thorns-choice-max" name="thorns-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "ref">
<div id="ref-choice-fixed-container" style = "display:none" >
<label for="ref-choice-fixed">Reflection Chance %:</label><br/>
<input class="number-input" id="ref-choice-fixed" name="ref-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="ref-choice-container">
<label for = "ref-choice">Reflection Chance %:</label><br/>
<table id = "ref-choice">
<tr>
<td>
<label for="ref-choice-base">base:</label>
<input class="number-input small-input" id="ref-choice-base" name="ref-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="ref-choice-min">min:</label>
<input class="number-input small-input" id="ref-choice-min" name="ref-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="ref-choice-max">max:</label>
<input class="number-input small-input" id="ref-choice-max" name="ref-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "expd">
<div id="expd-choice-fixed-container" style = "display:none" >
<label for="expd-choice-fixed">Exploding Chance %:</label><br/>
<input class="number-input" id="expd-choice-fixed" name="expd-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="expd-choice-container">
<label for = "expd-choice">Exploding Chance %:</label><br/>
<table id = "expd-choice">
<tr>
<td>
<label for="expd-choice-base">base:</label>
<input class="number-input small-input" id="expd-choice-base" name="expd-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="expd-choice-min">min:</label>
<input class="number-input small-input" id="expd-choice-min" name="expd-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="expd-choice-max">max:</label>
<input class="number-input small-input" id="expd-choice-max" name="expd-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "jh">
<div id="jh-choice-fixed-container" style = "display:none" >
<label for="jh-choice-fixed">Jump Height:</label><br/>
<input class="number-input" id="jh-choice-fixed" name="jh-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="jh-choice-container">
<label for = "jh-choice">Jump Height:</label><br/>
<table id = "jh-choice">
<tr>
<td>
<label for="jh-choice-base">base:</label>
<input class="number-input small-input" id="jh-choice-base" name="jh-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="jh-choice-min">min:</label>
<input class="number-input small-input" id="jh-choice-min" name="jh-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="jh-choice-max">max:</label>
<input class="number-input small-input" id="jh-choice-max" name="jh-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "spd">
<div id="spd-choice-fixed-container" style = "display:none" >
<label for="spd-choice-fixed">Walk Speed %:</label><br/>
<input class="number-input" id="spd-choice-fixed" name="spd-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="spd-choice-container">
<label for = "spd-choice">Walk Speed %:</label><br/>
<table id = "spd-choice">
<tr>
<td>
<label for="spd-choice-base">base:</label>
<input class="number-input small-input" id="spd-choice-base" name="spd-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spd-choice-min">min:</label>
<input class="number-input small-input" id="spd-choice-min" name="spd-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spd-choice-max">max:</label>
<input class="number-input small-input" id="spd-choice-max" name="spd-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "sprint">
<div id="sprint-choice-fixed-container" style = "display:none" >
<label for="sprint-choice-fixed">Sprint Bonus %:</label><br/>
<input class="number-input" id="sprint-choice-fixed" name="sprint-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="sprint-choice-container">
<label for = "sprint-choice">Sprint Bonus %:</label><br/>
<table id = "sprint-choice">
<tr>
<td>
<label for="sprint-choice-base">base:</label>
<input class="number-input small-input" id="sprint-choice-base" name="sprint-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="sprint-choice-min">min:</label>
<input class="number-input small-input" id="sprint-choice-min" name="sprint-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="sprint-choice-max">max:</label>
<input class="number-input small-input" id="sprint-choice-max" name="sprint-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "sprintReg">
<div id="sprintReg-choice-fixed-container" style = "display:none" >
<label for="sprintReg-choice-fixed">Sprint Regen %:</label><br/>
<input class="number-input" id="sprintReg-choice-fixed" name="sprintReg-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="sprintReg-choice-container">
<label for = "sprintReg-choice">Sprint Regen %:</label><br/>
<table id = "sprintReg-choice">
<tr>
<td>
<label for="sprintReg-choice-base">base:</label>
<input class="number-input small-input" id="sprintReg-choice-base" name="sprintReg-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="sprintReg-choice-min">min:</label>
<input class="number-input small-input" id="sprintReg-choice-min" name="sprintReg-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="sprintReg-choice-max">max:</label>
<input class="number-input small-input" id="sprintReg-choice-max" name="sprintReg-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class = "left">
<p class = "center">Spell Costs</p>
</td>
</tr>
<tr>
<td class="left" id = "spPct1">
<div id="spPct1-choice-fixed-container" style = "display:none" >
<label for="spPct1-choice-fixed">1st Spell Cost %:</label><br/>
<input class="number-input" id="spPct1-choice-fixed" name="spPct1-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="spPct1-choice-container">
<label for = "spPct1-choice">1st Spell Cost %:</label><br/>
<table id = "spPct1-choice">
<tr>
<td>
<label for="spPct1-choice-base">base:</label>
<input class="number-input small-input" id="spPct1-choice-base" name="spPct1-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spPct1-choice-min">min:</label>
<input class="number-input small-input" id="spPct1-choice-min" name="spPct1-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spPct1-choice-max">max:</label>
<input class="number-input small-input" id="spPct1-choice-max" name="spPct1-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "spPct2">
<div id="spPct2-choice-fixed-container" style = "display:none" >
<label for="spPct2-choice-fixed">2nd Spell Cost %:</label><br/>
<input class="number-input" id="spPct2-choice-fixed" name="spPct2-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="spPct2-choice-container">
<label for = "spPct2-choice">2nd Spell Cost %:</label><br/>
<table id = "spPct2-choice">
<tr>
<td>
<label for="spPct2-choice-base">base:</label>
<input class="number-input small-input" id="spPct2-choice-base" name="spPct2-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spPct2-choice-min">min:</label>
<input class="number-input small-input" id="spPct2-choice-min" name="spPct2-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spPct2-choice-max">max:</label>
<input class="number-input small-input" id="spPct2-choice-max" name="spPct2-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "spPct3">
<div id="spPct3-choice-fixed-container" style = "display:none" >
<label for="spPct3-choice-fixed">3rd Spell Cost %:</label><br/>
<input class="number-input" id="spPct3-choice-fixed" name="spPct3-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="spPct3-choice-container">
<label for = "spPct3-choice">3rd Spell Cost %:</label><br/>
<table id = "spPct3-choice">
<tr>
<td>
<label for="spPct3-choice-base">base:</label>
<input class="number-input small-input" id="spPct3-choice-base" name="spPct3-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spPct3-choice-min">min:</label>
<input class="number-input small-input" id="spPct3-choice-min" name="spPct3-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spPct3-choice-max">max:</label>
<input class="number-input small-input" id="spPct3-choice-max" name="spPct3-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "spPct4">
<div id="spPct4-choice-fixed-container" style = "display:none" >
<label for="spPct4-choice-fixed">4th Spell Cost %:</label><br/>
<input class="number-input" id="spPct4-choice-fixed" name="spPct4-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="spPct4-choice-container">
<label for = "spPct4-choice">4th Spell Cost %:</label><br/>
<table id = "spPct4-choice">
<tr>
<td>
<label for="spPct4-choice-base">base:</label>
<input class="number-input small-input" id="spPct4-choice-base" name="spPct4-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spPct4-choice-min">min:</label>
<input class="number-input small-input" id="spPct4-choice-min" name="spPct4-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spPct4-choice-max">max:</label>
<input class="number-input small-input" id="spPct4-choice-max" name="spPct4-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "spRaw1">
<div id="spRaw1-choice-fixed-container" style = "display:none" >
<label for="spRaw1-choice-fixed">1st Spell Cost Raw:</label><br/>
<input class="number-input" id="spRaw1-choice-fixed" name="spRaw1-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="spRaw1-choice-container">
<label for = "spRaw1-choice">1st Spell Cost Raw:</label><br/>
<table id = "spRaw1-choice">
<tr>
<td>
<label for="spRaw1-choice-base">base:</label>
<input class="number-input small-input" id="spRaw1-choice-base" name="spRaw1-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spRaw1-choice-min">min:</label>
<input class="number-input small-input" id="spRaw1-choice-min" name="spRaw1-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spRaw1-choice-max">max:</label>
<input class="number-input small-input" id="spRaw1-choice-max" name="spRaw1-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "spRaw2">
<div id="spRaw2-choice-fixed-container" style = "display:none" >
<label for="spRaw2-choice-fixed">2nd Spell Cost Raw:</label><br/>
<input class="number-input" id="spRaw2-choice-fixed" name="spRaw2-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="spRaw2-choice-container">
<label for = "spRaw2-choice">2nd Spell Cost Raw:</label><br/>
<table id = "spRaw2-choice">
<tr>
<td>
<label for="spRaw2-choice-base">base:</label>
<input class="number-input small-input" id="spRaw2-choice-base" name="spRaw2-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spRaw2-choice-min">min:</label>
<input class="number-input small-input" id="spRaw2-choice-min" name="spRaw2-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spRaw2-choice-max">max:</label>
<input class="number-input small-input" id="spRaw2-choice-max" name="spRaw2-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "spRaw3">
<div id="spRaw3-choice-fixed-container" style = "display:none" >
<label for="spRaw3-choice-fixed">3rd Spell Cost Raw:</label><br/>
<input class="number-input" id="spRaw3-choice-fixed" name="spRaw3-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="spRaw3-choice-container">
<label for = "spRaw3-choice">3rd Spell Cost Raw:</label><br/>
<table id = "spRaw3-choice">
<tr>
<td>
<label for="spRaw3-choice-base">base:</label>
<input class="number-input small-input" id="spRaw3-choice-base" name="spRaw3-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spRaw3-choice-min">min:</label>
<input class="number-input small-input" id="spRaw3-choice-min" name="spRaw3-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spRaw3-choice-max">max:</label>
<input class="number-input small-input" id="spRaw3-choice-max" name="spRaw3-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "spRaw4">
<div id="spRaw4-choice-fixed-container" style = "display:none" >
<label for="spRaw4-choice-fixed">4th Spell Cost Raw:</label><br/>
<input class="number-input" id="spRaw4-choice-fixed" name="spRaw4-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="spRaw4-choice-container">
<label for = "spRaw4-choice">4th Spell Cost Raw:</label><br/>
<table id = "spRaw4-choice">
<tr>
<td>
<label for="spRaw4-choice-base">base:</label>
<input class="number-input small-input" id="spRaw4-choice-base" name="spRaw4-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spRaw4-choice-min">min:</label>
<input class="number-input small-input" id="spRaw4-choice-min" name="spRaw4-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spRaw4-choice-max">max:</label>
<input class="number-input small-input" id="spRaw4-choice-max" name="spRaw4-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class = "left">
<p class = "center">Miscellaneous</p>
</td>
</tr>
<tr>
<td class="left" id = "xpb">
<div id="xpb-choice-fixed-container" style = "display:none" >
<label for="xpb-choice-fixed">Combat XP Bonus %:</label><br/>
<input class="number-input" id="xpb-choice-fixed" name="xpb-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="xpb-choice-container">
<label for = "xpb-choice">Combat XP Bonus %:</label><br/>
<table id = "xpb-choice">
<tr>
<td>
<label for="xpb-choice-base">base:</label>
<input class="number-input small-input" id="xpb-choice-base" name="xpb-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="xpb-choice-min">min:</label>
<input class="number-input small-input" id="xpb-choice-min" name="xpb-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="xpb-choice-max">max:</label>
<input class="number-input small-input" id="xpb-choice-max" name="xpb-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "gXp">
<div id="gXp-choice-fixed-container" style = "display:none" >
<label for="gXp-choice-fixed">Gathering XP Bonus %:</label><br/>
<input class="number-input" id="gXp-choice-fixed" name="gXp-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="gXp-choice-container">
<label for = "gXp-choice">Gathering XP Bonus %:</label><br/>
<table id = "gXp-choice">
<tr>
<td>
<label for="gXp-choice-base">base:</label>
<input class="number-input small-input" id="gXp-choice-base" name="gXp-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="gXp-choice-min">min:</label>
<input class="number-input small-input" id="gXp-choice-min" name="gXp-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="gXp-choice-max">max:</label>
<input class="number-input small-input" id="gXp-choice-max" name="gXp-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "gSpd">
<div id="gSpd-choice-fixed-container" style = "display:none" >
<label for="gSpd-choice-fixed">Gathering Speed Bonus %:</label><br/>
<input class="number-input" id="gSpd-choice-fixed" name="gSpd-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="gSpd-choice-container">
<label for = "gSpd-choice">Gathering Speed Bonus %:</label><br/>
<table id = "gSpd-choice">
<tr>
<td>
<label for="gSpd-choice-base">base:</label>
<input class="number-input small-input" id="gSpd-choice-base" name="gSpd-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="gSpd-choice-min">min:</label>
<input class="number-input small-input" id="gSpd-choice-min" name="gSpd-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="gSpd-choice-max">max:</label>
<input class="number-input small-input" id="gSpd-choice-max" name="gSpd-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "eSteal">
<div id="eSteal-choice-fixed-container" style = "display:none" >
<label for="eSteal-choice-fixed">Stealing %:</label><br/>
<input class="number-input" id="eSteal-choice-fixed" name="eSteal-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="eSteal-choice-container">
<label for = "eSteal-choice">Stealing %:</label><br/>
<table id = "eSteal-choice">
<tr>
<td>
<label for="eSteal-choice-base">base:</label>
<input class="number-input small-input" id="eSteal-choice-base" name="eSteal-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="eSteal-choice-min">min:</label>
<input class="number-input small-input" id="eSteal-choice-min" name="eSteal-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="eSteal-choice-max">max:</label>
<input class="number-input small-input" id="eSteal-choice-max" name="eSteal-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "lb">
<div id="lb-choice-fixed-container" style = "display:none" >
<label for="lb-choice-fixed">Loot Bonus %:</label><br/>
<input class="number-input" id="lb-choice-fixed" name="lb-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="lb-choice-container">
<label for = "lb-choice">Loot Bonus %:</label><br/>
<table id = "lb-choice">
<tr>
<td>
<label for="lb-choice-base">base:</label>
<input class="number-input small-input" id="lb-choice-base" name="lb-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="lb-choice-min">min:</label>
<input class="number-input small-input" id="lb-choice-min" name="lb-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="lb-choice-max">max:</label>
<input class="number-input small-input" id="lb-choice-max" name="lb-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "lq">
<div id="lq-choice-fixed-container" style = "display:none" >
<label for="lq-choice-fixed">Loot Quality %:</label><br/>
<input class="number-input" id="lq-choice-fixed" name="lq-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="lq-choice-container">
<label for = "lq-choice">Loot Quality %:</label><br/>
<table id = "lq-choice">
<tr>
<td>
<label for="lq-choice-base">base:</label>
<input class="number-input small-input" id="lq-choice-base" name="lq-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="lq-choice-min">min:</label>
<input class="number-input small-input" id="lq-choice-min" name="lq-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="lq-choice-max">max:</label>
<input class="number-input small-input" id="lq-choice-max" name="lq-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
<tr>
<td class="left" id = "spRegen">
<div id="spRegen-choice-fixed-container" style = "display:none" >
<label for="spRegen-choice-fixed">Soul Point Regen %:</label><br/>
<input class="number-input" id="spRegen-choice-fixed" name="spRegen-choice-fixed" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div id="spRegen-choice-container">
<label for = "spRegen-choice">Soul Point Regen %:</label><br/>
<table id = "spRegen-choice">
<tr>
<td>
<label for="spRegen-choice-base">base:</label>
<input class="number-input small-input" id="spRegen-choice-base" name="spRegen-choice-base" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spRegen-choice-min">min:</label>
<input class="number-input small-input" id="spRegen-choice-min" name="spRegen-choice-min" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
<td>
<label for="spRegen-choice-max">max:</label>
<input class="number-input small-input" id="spRegen-choice-max" name="spRegen-choice-max" value="" tabindex=""/>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</td>
</tr>
</table>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
</td>
</tr>
</table>
</div>
</div>
<div class = "right-side-container" style = "grid-item-2">
<div class = "sticky-box" id = "right-container">
<div class = "container button-container">
<p></p>
<p class = "center smalltitle">Options</p>
<p></p>
<div class = "button create-button" style = "grid-item-1">
<button class = "create-button" id = "create-button" onclick = "calculateCustom()">
Create
</button>
</div>
<div class = "button copy-button" style = "grid-item-3">
<button class = "copy-button" id = "copy-button" onclick = "copyCustom()">
Copy
</button>
</div>
<div class = "button set-button center" style = "grid-item-4">
<div class = "">Fixed IDs:</div>
</div>
<div class = "button reset-button" style = "grid-item-2">
<button class = "reset-button" id = "reset-button" onclick = "resetFields()">
Reset
</button>
</div>
<div class = "button copy-button-long" style = "grid-item-6">
<button class = "copy-button-long" id = "copy-button-long" onclick = "copyCustomLong()">
Copy Long
</button>
</div>
<div class="button set-button center" id = "fixID" style = "grid-item-5">
<button class = "fixID-choice" id = "fixID-choice" onclick = "toggleButton('fixID-choice'); toggleYN('fixID-choice'); toggleFixed({textContent})" tabindex="">no</button>
<p class="error" style="color: red; top: 30px; font-size: 10px; padding: 0; margin: 0; height: 5px; font-family: 'Nunito', sans-serif; word-break:break-word;"></p>
</div>
<div class = "button set-button" style = "grid-item-7">
<div class = "">Base Item: </div>
</div>
<div class = "button set-button" style = "grid-item-8">
<input class = "input" list = "base-list" id = "base-input" value = ""></input>
<datalist id = "base-list"></datalist>
</div>
<div class = "button set-button" style = "grid-item-9">
<button class = "set-button" id = "set-button" onclick = "useBaseItem('base-input')">
Use
</button>
</div>
</div>
<div class = "custom container center hide-container-block" style = "display:none">
<div class = "custom-stats">
<div class = "center" id = "custom-stats"></div>
</div>
</div>
</div>
</div>
</div>
<div class = "center">
<footer>
<div class="center" id="header2">
<p>Made by <b class = "hppeng">hppeng</b> and <b class = "ferricles">ferricles</b> with <a href = "./atlas.html" target = "_blank" class = "link">Atlas Inc</a> (JavaScript required to function, nothing works without js)</p>
<p>Hard refresh the page (Ctrl+Shift+R on windows/chrome) if it isn't updating correctly.</p>
</div>
<div class="center" id="credits">
<a href="credits.txt" class="link">Additional credits</a>
</div>
</footer>
</div>
<script type="text/javascript" src="utils.js"></script>
<script type="text/javascript" src="loadheader.js"></script>
<script type="text/javascript" src="icons.js"></script>
<script type="text/javascript" src="powders.js"></script>
<script type="text/javascript" src="build_utils.js"></script>
<script type="text/javascript" src="skillpoints.js"></script>
<script type="text/javascript" src="damage_calc.js"></script>
<script type="text/javascript" src="load.js"></script>
<script type="text/javascript" src="load_ing.js"></script>
<script type="text/javascript" src="crafter.js"></script>
<script type="text/javascript" src="craft.js"></script>
<script type="text/javascript" src="display.js"></script>
<script type="text/javascript" src="custom.js"></script>
<script type="text/javascript" src="customizer.js"></script>
</body>
</html>