roll20-character-sheets/Sentinel Comics RPG/SCRPG-Sheet.html

<!-- define which tab is displayed -->
<input type='hidden' class='tabstoggle' name='attr_sheetTab'  value='hero' />
<!-- Buttons for Tabs -->
<div class="flexrow">
    <input type='hidden' class='tabstoggle' name='attr_sheetTab'  value='hero' />
    <button type="action" class="herobutton" name="act_hero" >Hero</button>
    <button type="action" class="abilbutton" name="act_abilities" >Abilities</button>
    <button type="action" class="formbutton" name="act_auxiliary" >Forms / Modes</button>
    <button type="action" class="minibutton" name="act_minions" >Minions</button>
    <!-- Roll Macro -->
    <div class="flexspace"></div>
    <input type='hidden' class='tabstoggle' name='attr_sheetTab'  value='hero' />
    <div class='hero abilities aux minions villain'>
        <button type='roll' class='rolldice flexspace' name='roll_action' value='
            &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{modenum=[[@{poweromode}]]}} {{mode1=@{g1name}}} {{mode2=@{g2name}}} {{mode3=@{g3name}}} {{mode4=@{y1name}}} {{mode5=@{y2name}}} {{mode6=@{r1name}}} {{divided=[[@{civilianoheroic}]]}} {{divided1=@{divided1name}}} {{divided2=@{divided2name}}} {{die1-@{power_value}=1}} {{r1name=@{power_chosen} - @{power_value} = }} {{roll1=[[@{power_value}cs>13cf<0]]}} {{die2-@{quality_value}=1}} {{r2name=@{quality_chosen} - @{quality_value} = }} {{roll2=[[@{quality_value}cs>13cf<0]]}} {{die3-@{status_value}=1}} {{r3name=@{status_chosen} - @{status_value} = }} {{roll3=[[@{status_value}cs>13cf<0]]}}'><b><span style="font-family: 'dicefontd4'">0</span><span style="font-family: 'dicefontd6'">0</span><span style="font-family: 'dicefontd8'">0</span>Roll Action Dice<span style="font-family: 'dicefontd10'">0</span><span style="font-family: 'dicefontd12'">0</span></b>
        </button>
    </div>
    <div class='environment'>
        <button type='roll' class='rolldice flexspace' name='roll_environment' value='
            &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{die1-@{eTrait1die}=1}} {{r1name=@{eTrait1} - @{eTrait1die} = }} {{roll1=[[@{eTrait1die}cs>13cf<0]]}} {{die2-@{eTrait2die}=1}} {{r2name=@{eTrait2} - @{eTrait2die} = }} {{roll2=[[@{eTrait2die}cs>13cf<0]]}} {{die3-@{eTrait3die}=1}} {{r3name=@{eTrait3} - @{eTrait3die} = }} {{roll3=[[@{eTrait3die}cs>13cf<0]]}}'>
            <b><span style="font-family: 'dicefontd4'">0</span><span style="font-family: 'dicefontd6'">0</span><span style="font-family: 'dicefontd8'">0</span>Roll Environment<span style="font-family: 'dicefontd10'">0</span><span style="font-family: 'dicefontd12'">0</span></b>
        </button>
    </div>
    <div class="flexspace"></div>
    <button type="action" class="villbutton" name="act_villain" >Villain</button>
    <button type="action" class="envibutton" name="act_environment" >Environment</button>
    <div class="flexspace"></div>
    <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
    <button type="action" name="act_source_toggle" class="lock" style=width:100px>
        Sourcebook*
        <span class="hide" style="font-family: 'Pictos'">(</span>
        <span class="show" style="font-family: 'Pictos'">)</span>
    </button>
</div>
<div class="col" style="width: 100%; height: 15px;"></div>
<div class='hero'>
    <!-- Logo and Name -->
    <div class="logo-img" style="width: 50%; float: left;">
        <img src="https://i.imgur.com/yOvY9Kv.png.png">
    </div>
    <div class="col" style="width: 50%;">
        <div class="col" style="float: right; width: 100%; height: 70px; border-style: solid; border-width: 1%; background-color: #fde2c3;">
            <h2 class="detail-head">Player</h2><input class="detail-input" type="text" name="attr_player_name" style="width: 95%;">
        </div>
    </div>
    <!-- Hero and Alias -->
    <div class="col" style="width: 100%; height: 70px; border-style: solid; border-width: 1%; background-color: #fde2c3;">
       <div class="sheet2rowcol">
            <div class="col" style="width: 49%;">
                <h2 class="detail-head"><b>Hero Name</b></h2><input class="detail-input" type="text" name="attr_character_name" style="width: 95%;">
            </div>
            <div class="col" style="width: 49%; float: right;">
                <h2 class="detail-head"><b>Alias</b></h2><input class="detail-input" type="text" name="attr_alias" style="width: 95%;">
            </div>
        </div>
    </div>
    <div class="col" style="width: 100%; height: 15px;"></div>
    <!-- Physical Attributes -->
    <div class="col" style="width: 100%; float: left; border-style: solid; border-width: 1%; background-color: #fde2c3;">
        <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
        <div class='flexrow'>
            <h2 class="detail-head"><b>Physical Attributes</b></h2><div class="col" style="width: 5px;"></div>
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="nonsource">
                <button type='roll' class='rolldice' name='hero_print' value='
                    &{template:default} {{name=@{character_name} - Physical Attributes}} {{Gender=@{gender}}} {{Age=@{age}}} {{Height=@{height}}} {{Eyes=@{eyes}}} {{Hair=@{hair}}} {{Skin=@{skin}}} {{Build=@{herobuild}}} {{Costume/ Equipment=@{costume}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
        </div>
        <b>Gender </b><input class="peach-fill" type="text" name="attr_gender" style="width: 24%;"/>
        <b>Age </b><input  class="peach-fill" type="text" name="attr_age" style="width: 34%;"/>
        <b>Height </b><input class="peach-fill" type="text" name="attr_height" style="width: 24%;"/>
        <div style="width: 100%">
        <b>Eyes </b><input class="peach-fill" type="text" name="attr_eyes" style="width: 24%;">
        <b>Hair </b><input class="peach-fill" type="text" name="attr_hair" style="width: 31%;">
        <b>Skin </b><input class="peach-fill" type="text" name="attr_skin" style="width: 30%;">
        </div>
        <div style="width: 100%">
        <b>Build </b><input class="peach-fill" type="text" name="attr_herobuild" style="width: 93%;">
        </div>
        <b>Costume/Equipment</b>
        <textarea class="peach-fill" name="attr_costume" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
    </div>
    <div class="col" style="width: 100%; height: 15px;"></div>
    <!-- Characteristics -->
    <div style="width: 100%; float: left; border-style: solid; border-width: 1%; background-color: #fde2c3;">
        <div class="descgrid" style="width: 97%">
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class='flexrow'>
                <h2 class="detail-head"><b>Characteristics</b></h2><div class="col" style="width: 5px;"></div>
                <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
                <div class="nonsource">
                    <button type='roll' class='rolldice' name='hero_print' value='
                        &{template:default} {{name=@{character_name} - Characteristics}} {{Background=@{background}}} {{Power Source=@{powersource}}} {{Archetype=@{archetype}}} {{Personality=@{personality}}}'>
                        <b><span style="font-family: 'Pictos'">/</span></b>
                    </button>
                </div>
            </div>
            <h2></h2>
            <div class="descinline"><b>Background</b><input type="text" name="attr_background" style="width: 100%;"></div>
            <div class="descinline"><b>Power Source</b><input type="text" name="attr_powersource" style="width: 100%;"></div>
            <div class="descinline sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_background_sourcebook" value="SCRPG:Core p48" style="width: 75%;"></div>
            <div class="descinline sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_powersource_sourcebook" value="SCRPG:Core p56" style="width: 75%;"></div>
            <div class="sourceinput" style="width: 100%; height: 5px;"></div><div class="sourceinput"></div>
            <div class="descinline"><b>Archetype</b><input type="text" name="attr_archetype" style="width: 100%;"></div>
            <div class="descinline"><b>Personality</b><input type="text" name="attr_personality" style="width: 100%;"></div>
            <div class="descinline sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_archetype_sourcebook" value="SCRPG:Core p72" style="width: 75%;"></div>
            <div class="descinline sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_personality_sourcebook" value="SCRPG:Core p100" style="width: 75%;"></div>
        </div>
    </div>
    <div class="col" style="width: 100%; height: 15px;"></div>
    <!-- PRINCIPLES -->
    <div class="descgrid" style="width: 97%">
        <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
        <div class="flexrow"><h3>Principle of</h3><div class="col" style="width: 5px;"></div>
            <input class="typed-head" type="text" name="attr_principle_name1" style="width: 65%;">
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="nonsource">
                <button type='roll' class='rolldice' name='principle_print' value='
                    &{template:default} {{name=@{character_name} - Principle of @{principle_name1}}} {{During Roleplaying}} {{@{principle_rp1}}} {{Minor Twist}} {{@{principle_minor1}}} {{Major Twist}} {{@{principle_major1}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
        </div>
        <div class="flexrow"><h3>Principle of</h3><div class="col" style="width: 5px;"></div>
            <input class="typed-head" type="text" name="attr_principle_name2" style="width: 65%;">
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="nonsource">
                <button type='roll' class='rolldice' name='principle_print' value='
                    &{template:default} {{name=@{character_name} - Principle of @{principle_name2}}} {{During Roleplaying}} {{@{principle_rp2}}} {{Minor Twist}} {{@{principle_minor2}}} {{Major Twist}} {{@{principle_major2}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
        </div>
        <div class="descinline sourceinput"><b>*Sourcebook</b>
            <input type="text" name="attr_principle1_sourcebook" value="SCRPG:Core p122" style="width: 75%;"></div>
        <div class="descinline sourceinput"><b>*Sourcebook</b>
            <input type="text" name="attr_principle2_sourcebook" value="SCRPG:Core p122" style="width: 75%;"></div>
    </div>
    <div class="principles" style="border-style: solid; border-width: 1%;">
        <div class="sheet2rowcol">
            <div class="col" style="width: 49%;">
                <p style="text-align:center"><b>During Roleplaying</b></p>
                <textarea name="attr_principle_rp1" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
                <p style="text-align:center"><b>Minor Twist</b></p>
                <textarea name="attr_principle_minor1" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
                <p style="text-align:center"><b>Major Twist</b></p>
                <textarea name="attr_principle_major1" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
            </div>
            <div class="col" style="width: 49%;">
                <p style="text-align:center"><b>During Roleplaying</b></p>
                <textarea name="attr_principle_rp2" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
                <p style="text-align:center"><b>Minor Twist</b></p>
                <textarea name="attr_principle_minor2" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
                <p style="text-align:center"><b>Major Twist</b></p>
                <textarea name="attr_principle_major2" style="height: 81px; margin: 0px 0px 8.99148px; width: 96%; resize: none;"></textarea>
            </div>
        </div>
    </div>
    <div class="col" style="width: 100%; height: 15px;"></div>

    <!-- HERO POINTS / ISSUES / COLLECTIONS (REPEATING) -->
    <div class="3colrow">
        <div class="col" style="width: width: 10%; background-color: #e8eff6;">
            <div class="details" style="border-style: solid; border-width: 1%;">
                <h3><b>Hero Points this Issue:</b></h3>
                <div class="5colrow">
                    <div class="col" style="width: 6%;">
                        <input type="checkbox" name="attr_1hp" style="width: 35px; height: 35px; margin: 0 auto; float: left; margin-left: 10px;">
                    </div>
                    <div class="col" style="width: 6%;">
                        <input type="checkbox" name="attr_2hp" style="width: 35px; height: 35px; margin: 0 auto; float: left; margin-left: 10px;">
                    </div>
                    <div class="col" style="width: 6%;">
                        <input type="checkbox" name="attr_3hp" style="width: 35px; height: 35px; margin: 0 auto; float: left; margin-left: 10px;">
                    </div>
                    <div class="col" style="width: 6%;">
                        <input type="checkbox" name="attr_4hp" style="width: 35px; height: 35px; margin: 0 auto; float: left; margin-left: 10px;">
                    </div>
                    <div class="col" style="width: 6%;">
                        <input type="checkbox" name="attr_5hp" style="width: 35px; height: 35px; margin: 0 auto; float: left; margin-left: 10px;">
                    </div>
                </div>
                <div class="col" style="width: 100%; height: 15px;"></div>
                <h3><b>Hero Points Rewards</b></h3>
                <b>+1 </b><input  class="detail-input" type="number" name="attr_plus1" style="width: 16%;" value="0"/>
                <b>+2 </b><input  class="detail-input" type="number" name="attr_plus2" style="width: 16%;" value="0"/>
                <b>+3 </b><input  class="detail-input" type="number" name="attr_plus3" style="width: 16%;" value="0"/>
                <b>+4 </b><input  class="detail-input" type="number" name="attr_plus4" style="width: 16%;" value="0"/>
            </div>
        </div>
        <div class="col" style="width: width: 35%;">
            <div class="details" style="border-style: solid; border-width: 1%; background-color: #e8eff6;">
                <h3><b>Back Issues </b></h3>
                <fieldset class="repeating_issues">
                    <input type="text" name="attr_issue">
                </fieldset>
                <em>6 Issues = 1 Collection</em>
            </div>
        </div>
        <div class="col" style="width: width: 35%;">
            <div class="details" style="border-style: solid; border-width: 1%; background-color: #e8eff6;">
                <h3><b>Collections </b></h3>
                <fieldset class="repeating_collections">
                    <input type="checkbox" name="attr_collection-check">
                    <input type="text" name="attr_collection">
                </fieldset>
            </div>
        </div>
    </div>
</div>
<div class='villain'>
    <!-- VILLAIN -->
    <!-- Villain Name -->
    <div class="col" style="width: 49%; border-style: solid; border-width: 1%; border-color: #dc2f34; background-color: #eaeae9;">
        <h2 style="color: #dc2f34;"><b>Villain Name</b></h2>
        <input class="detail-input" type="text" name="attr_character_name" style="width: 97%; font-weight: bold; font-size: xx-large;">
        <div style="width: 100%; height: 6.5px;"></div>
    </div>
    <!-- Characteristics -->
    <div class="col" style="width: 49%; float: right; border-style: solid; border-width: 1%; border-color: #dc2f34; background-color: #eaeae9;">
        <div style="width: 97%">
            <div style="width: 100%; height: 3px;"></div>
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="descinline"><b>Alias:</b><input type="text" name="attr_alias" style="width: 100%;"></div>
            <div class="sourceinput" style="width: 100%; height: 5px;"></div>
            <div class="descinline"><b>Approach:</b><input type="text" name="attr_approach" style="width: 100%;"></div>
            <div class="descinline sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_approach_sourcebook" value="SCRPG:Core p208-209" style="width: 75%;"></div>
            <div class="sourceinput" style="width: 100%; height: 5px;"></div>
            <div class="descinline"><b>Archetype:</b><input type="text" name="attr_archetype" style="width: 100%;"></div>
            <div class="descinline sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_archetype_sourcebook" value="SCRPG:Core p220" style="width: 75%;"></div>
            <div style="width: 100%; height: 3px;"></div>
        </div>
    </div>
    <div class="col" style="width: 100%; height: 15px;"></div>
    <div class="vhealth">
        <!-- Logo -->
        <img class="vlogo" src="https://i.imgur.com/y7dLVqV.png">
        <!-- Villain Health-->
        <img class="hhead" src="https://i.imgur.com/bzuXbDT.png">
        <h3 class="shead hhead" style="text-indent: 5px;">Health</h3>
        <img class="hchead" src="https://i.imgur.com/bzuXbDT.png">
        <h3 class="shead hchead" style="text-indent: 5px;">Current Health</h3>
        <img class="hmax" src="https://i.imgur.com/FmcydJE.png">
        <div class="hmax"><input type="number" name="attr_health_max" style="width: 62px" value=17></div>
        <img class="hcur" src="https://i.imgur.com/FmcydJE.png">
        <div class="hcur"><input type="number" name="attr_health" style="width: 62px" value=17></div>
    </div>
    <div class="col" style="width: 100%; height: 15px;"></div>
</div>
<div class='abilities villain'>
    <!-- Divided Toggle-->
    <input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
    <div class="dividedeither">
        <div class="flexrow">
            <input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
            <div class="flexspace"></div>
            <div class="divideleft" style="width: 40%"><input type="text" class="typed-head" name="attr_divided1name" value="Character's Civilian Form" style="width: 100%"></div>
            <div class="flexspace"></div>
            <!--Button facing left or right-->
            <div class="dividedcivilian">
                <button type="action" name="act_divided_toggle">◀</button>
            </div>
            <div class="dividedheroic">
                <button type="action" name="act_divided_toggle">▶</button>
            </div>
            <div class="flexspace"></div>
            <div class="divideright" style="width: 40%"><input type="text" class="typed-head" name="attr_divided2name" value="Character's Heroic Form" style="width: 100%"></div>
            <div class="flexspace"></div>
        </div>
    </div>
    <!-- POWERS / QUALITIES (REPEATING) / STATUS -->
    <div class="flexrow" style="border-style: solid; border-width: 1%;">
        <input type='hidden' class='tabstoggle' name='attr_sheetTab'  value='description' />
        <input type="hidden" class="modeselect" name="attr_poweromode" value="0" />
        <input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
        <input type="hidden" class="divideddouble" name="attr_usingdouble" value="0" />
        <!-- Powers -->
        <div class='powerbase' style="width: 33%;">
            <h3>Powers</h3>
            <fieldset class="repeating_powers">
                <input type="text" name="attr_power" style="width: 60%; float: left;">
                <select name="attr_powerdtype" style="width: 20%; float: left;">
                <option value="d0" selected>-</option>
                <option value="d4">d4</option>
                <option value="d6">d6</option>
                <option value="d8">d8</option>
                <option value="d10">d10</option>
                <option value="d12">d12</option>
                </select>
                <input type="checkbox" name="attr_powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
            </fieldset>
            <div class="col" style="width: 80%; border-style: solid; border-width: 1%;">
                <input type="text" name="attr_power_chosen" style="width: 75%; float: left;" value='Untrained Power'>
                <input type="text" name="attr_power_value" style="width: 25%; float: left;" value='d4'>
            </div>
            <button type='roll' class='rolldice' name='roll_power' value='
                &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{modenum=[[@{poweromode}]]}} {{mode1=@{g1name}}} {{mode2=@{g2name}}} {{mode3=@{g3name}}} {{mode4=@{y1name}}} {{mode5=@{y2name}}} {{mode6=@{r1name}}} {{divided=[[@{civilianoheroic}]]}} {{divided1=@{divided1name}}} {{divided2=@{divided2name}}} {{suffix= - Power}} {{die1-@{power_value}=1}} {{r1name=@{power_chosen} - @{power_value} = }} {{roll1=[[@{power_value}cs>13cf<0]]}}'>
                <b><span style="font-family: 'dicefontd10'">0</span></b>
            </button>
        </div>
        <!-- Modes -->
        <div class='modebase' style="width: 33%;">
            <input type="text" style="width: 60%; float: left;" class="typed-head" value="Forms / Modes">
            <input type="text" style="width: 60%; float: left;" class="gfill" name="attr_g1name" value="Default Form/Mode">
            <input type="checkbox" name="attr_g1check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
            <input type="text" style="width: 60%; float: left;" class="gfill" name="attr_g2name">
            <input type="checkbox" name="attr_g2check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
            <input type="text" style="width: 60%; float: left;" class="gfill" name="attr_g3name">
            <input type="checkbox" name="attr_g3check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
            <input type="text" style="width: 60%; float: left;" class="yfill" name="attr_y1name">
            <input type="checkbox" name="attr_y1check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
            <input type="text" style="width: 60%; float: left;" class="yfill" name="attr_y2name">
            <input type="checkbox" name="attr_y2check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
            <input type="text" style="width: 60%; float: left;" class="rfill" name="attr_r1name">
            <input type="checkbox" name="attr_r1check" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 15px;">
            <div class="col" style="width: 100%; height: 33.5px;"></div>
            <div class="col" style="width: 80%; border-style: solid; border-width: 1%;">
                <input type="text" name="attr_power_chosen" style="width: 75%; float: left;" value='Untrained Power'>
                <input type="text" name="attr_power_value" style="width: 25%; float: left;" value='d4'>
            </div>
            <button type='roll' class='rolldice' name='roll_power' value='
                &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{suffix= - Power}} {{modenum=[[@{poweromode}]]}} {{mode1=@{g1name}}} {{mode2=@{g2name}}} {{mode3=@{g3name}}} {{mode4=@{y1name}}} {{mode5=@{y2name}}} {{mode6=@{r1name}}} {{divided=[[@{civilianoheroic}]]}} {{divided1=@{divided1name}}} {{divided2=@{divided2name}}} {{die1-@{power_value}=1}} {{r1name=@{power_chosen} - @{power_value} = }} {{roll1=[[@{power_value}cs>13cf<0]]}}'>
                <b><span style="font-family: 'dicefontd10'">0</span></b>
            </button>
        </div>
        <!-- Qualities (repeat for Divided)-->
        <div class='leftquality' style="width: 33%;">
            <h3>Qualities</h3>
            <fieldset class="repeating_qualities">
                <input type="text" name="attr_quality" style="width: 60%; float: left;">
                <select name="attr_qualitydtype" style="width: 20%; float: left;">
                    <option value="d0" selected>-</option>
                    <option value="d4">d4</option>
                    <option value="d6">d6</option>
                    <option value="d8">d8</option>
                    <option value="d10">d10</option>
                    <option value="d12">d12</option>
                </select>
                <input type="checkbox" name="attr_powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
            </fieldset>
            <div class="col" style="width: 80%; border-style: solid; border-width: 1%;">
                <input type="text" name="attr_power_chosen" style="width: 75%; float: left;" value='Untrained Quality'>
                <input type="text" name="attr_power_value" style="width: 25%; float: left;" value='d4'>
            </div>
            <button type='roll' class='rolldice' name='roll_power' value='
                &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{suffix= - Quality}} {{modenum=[[@{poweromode}]]}} {{mode1=@{g1name}}} {{mode2=@{g2name}}} {{mode3=@{g3name}}} {{mode4=@{y1name}}} {{mode5=@{y2name}}} {{mode6=@{r1name}}} {{divided=[[@{civilianoheroic}]]}} {{divided1=@{divided1name}}} {{divided2=@{divided2name}}} {{die1-@{power_value}=1}} {{r1name=@{power_chosen} - @{power_value} = }} {{roll1=[[@{power_value}cs>13cf<0]]}}'>
                <b><span style="font-family: 'dicefontd10'">0</span></b>
            </button>
        </div>
        <div class="morespace leftquality"></div>
        <div class="morespace powerbase"></div>
        <!-- Powers (repeat for Divided) -->
        <div class='rightpower' style="width: 33%;">
            <h3>Powers</h3>
            <fieldset class="repeating_powers">
                <input type="text" name="attr_power" style="width: 60%; float: left;">
                <select name="attr_powerdtype" style="width: 20%; float: left;">
                <option value="d0" selected>-</option>
                <option value="d4">d4</option>
                <option value="d6">d6</option>
                <option value="d8">d8</option>
                <option value="d10">d10</option>
                <option value="d12">d12</option>
                </select>
                <input type="checkbox" name="attr_qualitycheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
            </fieldset>
            <div class="col" style="width: 80%; border-style: solid; border-width: 1%;">
                <input type="text" name="attr_quality_chosen" style="width: 75%; float: left;" value='Untrained Power'>
                <input type="text" name="attr_quality_value" style="width: 25%; float: left;" value='d4'>
            </div>
            <button type='roll' class='rolldice' name='roll_quality' value='
                &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{suffix= - Power}} {{modenum=[[@{poweromode}]]}} {{mode1=@{g1name}}} {{mode2=@{g2name}}} {{mode3=@{g3name}}} {{mode4=@{y1name}}} {{mode5=@{y2name}}} {{mode6=@{r1name}}} {{divided=[[@{civilianoheroic}]]}} {{divided1=@{divided1name}}} {{divided2=@{divided2name}}} {{die2-@{quality_value}=1}} {{r2name=@{quality_chosen} - @{quality_value} = }} {{roll2=[[@{quality_value}cs>13cf<0]]}}'>
                <b><span style="font-family: 'dicefontd10'">0</span></b>
            </button>
        </div>
        <!-- Qualities -->
        <div class='rightquality' style="width: 33%;">
            <h3>Qualities</h3>
            <fieldset class="repeating_qualities">
                <input type="text" name="attr_quality" style="width: 60%; float: left;">
                <select name="attr_qualitydtype" style="width: 20%; float: left;">
                    <option value="d0" selected>-</option>
                    <option value="d4">d4</option>
                    <option value="d6">d6</option>
                    <option value="d8">d8</option>
                    <option value="d10">d10</option>
                    <option value="d12">d12</option>
                </select>
                <input type="checkbox" name="attr_qualitycheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
            </fieldset>
            <div class="col" style="width: 80%; border-style: solid; border-width: 1%;">
                <input type="text" name="attr_quality_chosen" style="width: 75%; float: left;" value='Untrained Quality'>
                <input type="text" name="attr_quality_value" style="width: 25%; float: left;" value='d4'>
            </div>
            <button type='roll' class='rolldice' name='roll_quality' value='
                &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{suffix= - Quality}} {{modenum=[[@{poweromode}]]}} {{mode1=@{g1name}}} {{mode2=@{g2name}}} {{mode3=@{g3name}}} {{mode4=@{y1name}}} {{mode5=@{y2name}}} {{mode6=@{r1name}}} {{divided=[[@{civilianoheroic}]]}} {{divided1=@{divided1name}}} {{divided2=@{divided2name}}} {{die2-@{quality_value}=1}} {{r2name=@{quality_chosen} - @{quality_value} = }} {{roll2=[[@{quality_value}cs>13cf<0]]}}'>
                <b><span style="font-family: 'dicefontd10'">0</span></b>
            </button>
        </div>
        <div class="morespace"></div>
        <!-- Hero Status & Health-->
        <div class="abilities" style="width: 25%;">
            <div class="statusgrid">
                <h3></h3>
                <h3 class="shead">Status</h3>
                <h3></h3>
                <h3 class="shead">&</h3>
                <h3 class="shead">Health</h3>
                <!-- Green Status -->
                <div class="sgreen"></div>
                <div class="sgreen">Green</div>
                <div class="sgreen"></div>
                <div class="sgreen">Max</div>
                <div class="sgreen">Min</div>
                <div class="sgreen"><input type="checkbox" name="attr_greencheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; margin-left: 5px;"></div>
                <div class="sgreen">
                    <input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
                    <div class="dividedcivilian">
                        <select name="attr_greendtype" class="gdtype" style="width: 55px">
                            <option value="d0">-</option>
                            <option value="d6">d6</option>
                            <option value="d8">d8</option>
                            <option value="d10">d10</option>
                            <option value="d12">d12</option>
                        </select>
                    </div>
                    <div class="dividedheroic">
                        <select name="attr_green2dtype" class="gdtype" style="width: 55px">
                            <option value="d0">-</option>
                            <option value="d6">d6</option>
                            <option value="d8">d8</option>
                            <option value="d10">d10</option>
                            <option value="d12">d12</option>
                        </select>
                    </div>
                </div>
                <div class="sgreen"></div>
                <div class="sgreen"><input type="number" name="attr_health_max" style="width: 42px" value=17></div>
                <span class="sgreen" name="attr_greenmin"></span>
                <!-- Yellow Status -->
                <div class="syellow"></div>
                <div class="syellow">Yellow</div>
                <div class="syellow"></div>
                <div class="syellow">Max</div>
                <div class="syellow">Min</div>
                <div class="syellow"><input type="checkbox" name="attr_yellowcheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; margin-left: 5px;"></div>
                <div class="syellow">
                    <input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
                    <div class="dividedcivilian">
                        <select name="attr_yellowdtype" class="ydtype" style="width: 55px">
                            <option value="d0">-</option>
                            <option value="d6">d6</option>
                            <option value="d8">d8</option>
                            <option value="d10">d10</option>
                            <option value="d12">d12</option>
                        </select>
                    </div>
                    <div class="dividedheroic">
                        <select name="attr_yellow2dtype" class="gdtype" style="width: 55px">
                            <option value="d0">-</option>
                            <option value="d6">d6</option>
                            <option value="d8">d8</option>
                            <option value="d10">d10</option>
                            <option value="d12">d12</option>
                        </select>
                    </div>
                </div>
                <div class="syellow"></div>
                <span class="syellow" name="attr_yellowmax"></span>
                <span class="syellow" name="attr_yellowmin"></span>
                <!-- Red Status -->
                <div class="sred"></div>
                <div class="sred">Red</div>
                <div class="sred"></div>
                <div class="sred">Max</div>
                <div class="sred">Min</div>
                <div class="sred"><input type="checkbox" name="attr_redcheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; margin-left: 5px;"></div>
                <div class="sred">
                    <input type="hidden" class="dividedselect" name="attr_civilianoheroic" value="0" />
                    <div class="dividedcivilian">
                        <select name="attr_reddtype" class="ydtype" style="width: 55px">
                            <option value="d0">-</option>
                            <option value="d6">d6</option>
                            <option value="d8">d8</option>
                            <option value="d10">d10</option>
                            <option value="d12">d12</option>
                        </select>
                    </div>
                    <div class="dividedheroic">
                        <select name="attr_red2dtype" class="gdtype" style="width: 55px">
                            <option value="d0">-</option>
                            <option value="d6">d6</option>
                            <option value="d8">d8</option>
                            <option value="d10">d10</option>
                            <option value="d12">d12</option>
                        </select>
                    </div>
                </div>
                <div class="sred"></div>
                <span class="sred" name="attr_redmax"></span>
                <div class="sred">1</div>
                <!-- Out Status -->
                <div class="sgrey"><input type="checkbox" name="attr_outcheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; margin-left: 5px;"></div>
                <div class="sgrey">OUT</div>
                <!-- Current Health -->
                <div class="sblack"></div>
                <span class="sblack">Current</span>
                <div class="sblack"><input type="number" name="attr_health" style="width: 42px" value=17></div>
            </div>
            <!-- Status Tracking -->
            <div class="col" style="width: 91px; height: 30px; border-style: solid; border-width: 1%;">
                <input type="text" name="attr_status_chosen" style="width: 56%; float: left;" value='Out'>
                <input type="text" name="attr_status_value" style="width: 44%; float: left;" value='d0'>
            </div>
            <button type='roll' class='rolldice' name='roll_status' value='
                &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{suffix= - Status}} {{modenum=[[@{poweromode}]]}} {{mode1=@{g1name}}} {{mode2=@{g2name}}} {{mode3=@{g3name}}} {{mode4=@{y1name}}} {{mode5=@{y2name}}} {{mode6=@{r1name}}} {{divided=[[@{civilianoheroic}]]}} {{divided1=@{divided1name}}} {{divided2=@{divided2name}}} {{die3-@{status_value}=1}} {{r3name=@{status_chosen} - @{status_value} = }} {{roll3=[[@{status_value}cs>13cf<0]]}}'>
                <b><span style="font-family: 'dicefontd10'">0</span></b>
            </button>
        </div>
        <div class="flexspace"></div>
        <!-- Villain Status -->
        <div class="villain" style="width: 33%;">
            <div class="descinline"><h3>Status:</h3><input class="typed-head" type="text" name="attr_statushead" style="width: 75%;"></div>
            <fieldset class="repeating_statuses">
                <input type="text" name="attr_status" style="width: 60%; float: left;">
                <select name="attr_statusdtype" style="width: 20%; float: left;">
                    <option value="d0" selected>-</option>
                    <option value="d4">d4</option>
                    <option value="d6">d6</option>
                    <option value="d8">d8</option>
                    <option value="d10">d10</option>
                    <option value="d12">d12</option>
                </select>
                <input type="checkbox" name="attr_statuscheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
            </fieldset>
            <div class="col" style="width: 80%; border-style: solid; border-width: 1%;">
                <input type="text" name="attr_status_chosen" style="width: 75%; float: left;" value='Out'>
                <input type="text" name="attr_status_value" style="width: 25%; float: left;" value='d0'>
            </div>
            <button type='roll' class='rolldice' name='roll_status' value='
                &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{suffix= - Status: @{statushead}}} {{modenum=[[@{poweromode}]]}} {{mode1=@{g1name}}} {{mode2=@{g2name}}} {{mode3=@{g3name}}} {{mode4=@{y1name}}} {{mode5=@{y2name}}} {{mode6=@{r1name}}} {{divided=[[@{civilianoheroic}]]}} {{divided1=@{divided1name}}} {{divided2=@{divided2name}}} {{die3-@{status_value}=1}} {{r3name=@{status_chosen} - @{status_value} = }} {{roll3=[[@{status_value}cs>13cf<0]]}}'>
                <b><span style="font-family: 'dicefontd10'">0</span></b>
            </button>
        </div>
    </div>
    <div class="col" style="width: 100%; height: 15px;"></div>
</div>
<div class='abilities aux'>
    <!-- MODES / FORMS -->
    <input type="hidden" class="modeselect" name="attr_poweromode"  value="0" />
    <input type='hidden' class='tabstoggle' name='attr_sheetTab'  value='description'  />
    <!-- First Radio Button disables Forms/Modes -->
    <div class="mode0">
        <input type="radio" value="0" name="attr_moderadio" checked="true" />
        <div class="col"><h3>Character has no Alternate Forms or Modes</h3></div>
    </div>
    <!-- Default Mode & Notes -->
    <div class="modeg1">
        <div class="flexrow">
            <input type='hidden' class='tabstoggle' name='attr_sheetTab'  value='hero' />
            <input type="hidden" class="modeselect" name="attr_poweromode"  value="0" />
            <div class="mode0">
                <input type="radio" value="1" name="attr_moderadio" />
            </div>
            <input type="text" class="typed-head" name="attr_g1name" value="Default Form/Mode">
            <input type="hidden" class="direction" name="attr_g1direction" value="right" />
            <button type="action" name="act_g1direction_toggle" class="direction">
                <span class="down" style="color: #46e35e;">▼</span>
                <span class="right"  style="color: #46e35e;">►</span>
            </button>
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="nonsource">
                <button type='roll' class='rolldice' name='mode_g1_print' value='
                    &{template:scrpg} {{color-Green=1}} {{name=@{character_name}}} {{suffix= - @{g1name}}} {{type=All actions are normal.}} {{desc=@{g1desription}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
            <div class="sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_g1_sourcebook" value="SCRPG:Core p90/96" style="width: 61%">
            </div>
            <div class="flexspace"></div>
            <div class="eachform" style="width: 33%; float: right">
                <input type="text" class="typed-head" name="attr_auxnotesname" value="Notes">
            </div>
        </div>
        <input type="hidden" class="direction" name="attr_g1direction" value="right" />
        <div class="eachform">
            <div class="col" style="border-style: solid; border-width: 1%; background-color: #46e35e;; width: 60%;">
                <div class="2colrow">
                    <div class="col" style="width: 50%;">
                        <h3>Powers</h3>
                        <fieldset class="repeating_g1powers">
                            <input type="text" name="attr_g1power" style="width: 65%; float: left;">
                            <select name="attr_g1powerdtype" style="width: 22%; float: left;">
                                <option value="d0" selected>-</option>
                                <option value="d4">d4</option>
                                <option value="d6">d6</option>
                                <option value="d8">d8</option>
                                <option value="d10">d10</option>
                                <option value="d12">d12</option>
                            </select>
                            <input type="checkbox" name="attr_g1powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
                        </fieldset>
                    </div>
                    <div class="col" style="width: 35%;">
                        <h3>Description</h3>
                        <textarea name="attr_g1desription" style="width: 99%; height: 78px;"></textarea>
                        <p>Default Form/Mode.<br>All actions are normal.</p>
                    </div>
                </div>
            </div>
            <div class="col" style="width: 37%;">
                <textarea name="attr_auxnotes" style="width: 98%; height: 150px;"></textarea>
            </div>
            <div class="col" style="width: 100%; height: 15px;"></div>
        </div>
    </div>
    <!-- g2 is Second Green Mode -->
    <div class="modeg2">
        <div class="flexrow">
            <input type='hidden' class='tabstoggle' name='attr_sheetTab'  value='hero' />
            <input type="hidden" class="modeselect" name="attr_poweromode"  value="0" />
            <div class="mode0">
                <input type="radio" value="2" name="attr_moderadio" />
            </div>
            <input type="text" class="typed-head" name="attr_g2name">
            <input type="hidden" class="direction" name="attr_g2direction" value="right" />
            <button type="action" name="act_g2direction_toggle" class="direction">
                <span class="down" style="color: #46e35e;">▼</span>
                <span class="right"  style="color: #46e35e;">►</span>
            </button>
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="nonsource">
                <button type='roll' class='rolldice' name='mode_g2_print' value='
                    &{template:scrpg} {{color-Green=1}} {{name=@{character_name}}} {{suffix= - @{g2name}}} {{desc1=@{g2desription}}} {{name2=@{g2abilityname}}} {{icon1-@{g2icon1}=1}} {{icon2-@{g2icon2}=1}} {{icon3-@{g2icon3}=1}} {{type=Type: @{g2abilitytype}}} {{desc=@{g2abilitydesc}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
            <div class="sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_g2_sourcebook" value="SCRPG:Core p90/96" style="width: 61%">
            </div>
        </div>
        <input type="hidden" class="direction" name="attr_g2direction" value="right" />
        <div class="eachform" style="border-style: solid; border-width: 1%; background-color: #46e35e;">
            <div class="2colrow">
                <div class="col" style="width: 30%;">
                    <h3>Powers</h3>
                    <fieldset class="repeating_g2powers">
                        <input type="text" name="attr_g2power" style="width: 65%; float: left;">
                        <select name="attr_g2powerdtype" style="width: 22%; float: left;">
                            <option value="d0" selected>-</option>
                            <option value="d4">d4</option>
                            <option value="d6">d6</option>
                            <option value="d8">d8</option>
                            <option value="d10">d10</option>
                            <option value="d12">d12</option>
                        </select>
                        <input type="checkbox" name="attr_g2powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
                    </fieldset>
                </div>
                <div class="col" style="width: 65%;">
                    <h3>Description</h3>
                    <textarea name="attr_g2desription" style="width: 98%; height: 41px;"></textarea>
                    <b>Icon</b>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_g2icon1" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_g2icon1_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_g2icon2" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_g2icon2_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_g2icon3" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_g2icon3_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span><div class="col" style="width: 1.5%;"></div></span>
                    <b>Name</b>
                    <input type="text" name="attr_g2abilityname" style="width: 39%;">
                    <span><div class="col" style="width: 80px; float: right">
                        <b>Type</b>
                        <select name="attr_g2abilitytype" style="width: 42px;">
                            <option value="Action">A</option>
                            <option value="Inherent">I</option>
                            <option value="Reaction">R</option>
                        </select>
                    </div></span>
                    <textarea name="attr_g2abilitydesc" style="width: 98%; height: 31px;"></textarea>
                </div>
            </div>
        </div>
        <div class="eachform" style="width: 100%; height: 15px;"></div>
    </div>
    <!-- g3 is Third Green Mode -->
    <div class="modeg3">
        <div class="flexrow">
            <input type='hidden' class='tabstoggle' name='attr_sheetTab'  value='hero' />
            <input type="hidden" class="modeselect" name="attr_poweromode"  value="0" />
            <div class="mode0">
                <input type="radio" value="3" name="attr_moderadio" />
            </div>
            <input type="text" class="typed-head" name="attr_g3name">
            <input type="hidden" class="direction" name="attr_g3direction" value="right" />
            <button type="action" name="act_g3direction_toggle" class="direction">
                <span class="down" style="color: #46e35e;">▼</span>
                <span class="right"  style="color: #46e35e;">►</span>
            </button>
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="col nonsource">
                <button type='roll' class='rolldice' name='mode_g3_print' value='
                    &{template:scrpg} {{color-Green=1}} {{name=@{character_name}}} {{suffix= - @{g3name}}} {{desc1=@{g3desription}}} {{name2=@{g3abilityname}}} {{icon1-@{g3icon1}=1}} {{icon2-@{g3icon2}=1}} {{icon3-@{g3icon3}=1}} {{type=Type: @{g3abilitytype}}} {{desc=@{g3abilitydesc}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
            <div class="col sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_g3_sourcebook" value="SCRPG:Core p90/96" style="width: 61%">
            </div>
        </div>
        <input type="hidden" class="direction" name="attr_g3direction" value="right" />
        <div class="eachform" style="border-style: solid; border-width: 1%; background-color: #46e35e;;">
            <div class="2colrow">
                <div class="col" style="width: 30%;">
                    <h3>Powers</h3>
                    <fieldset class="repeating_g3powers">
                        <input type="text" name="attr_g3power" style="width: 65%; float: left;">
                        <select name="attr_g3powerdtype" style="width: 22%; float: left;">
                            <option value="d0" selected>-</option>
                            <option value="d4">d4</option>
                            <option value="d6">d6</option>
                            <option value="d8">d8</option>
                            <option value="d10">d10</option>
                            <option value="d12">d12</option>
                        </select>
                        <input type="checkbox" name="attr_g3powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
                    </fieldset>
                </div>
                <div class="col" style="width: 65%;">
                    <h3>Description</h3>
                    <textarea name="attr_g3desription" style="width: 98%; height: 41px;"></textarea>
                    <b>Icon</b>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_g3icon1" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_g3icon1_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_g3icon2" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_g3icon2_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_g3icon3" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_g3icon3_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span><div class="col" style="width: 1.5%;"></div></span>
                    <b>Name</b>
                    <input type="text" name="attr_g3abilityname" style="width: 39%;">
                    <span><div class="col" style="width: 80px; float: right">
                        <b>Type</b>
                        <select name="attr_g3abilitytype" style="width: 42px;">
                            <option value="Action">A</option>
                            <option value="Inherent">I</option>
                            <option value="Reaction">R</option>
                        </select>
                    </div></span>
                    <textarea name="attr_g3abilitydesc" style="width: 98%; height: 31px;"></textarea>
                </div>
            </div>
        </div>
        <div class="eachform" style="width: 100%; height: 15px;"></div>
    </div>
    <!-- y1 is First Yellow Mode -->
    <div class="modey1">
        <div class="flexrow">
            <input type='hidden' class='tabstoggle' name='attr_sheetTab'  value='hero' />
            <input type="hidden" class="modeselect" name="attr_poweromode"  value="0" />
            <div class="mode0">
                <input type="radio" value="4" name="attr_moderadio" />
            </div>
            <input type="text" class="typed-head" name="attr_y1name">
            <input type="hidden" class="direction" name="attr_y1direction" value="right" />
            <button type="action" name="act_y1direction_toggle" class="direction">
                <span class="down" style="color: #ffff99;">▼</span>
                <span class="right"  style="color: #ffff99;">►</span>
            </button>
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="col nonsource">
                <button type='roll' class='rolldice' name='mode_y1_print' value='
                    &{template:scrpg} {{color-Yellow=1}} {{name=@{character_name}}} {{suffix= - @{y1name}}} {{desc1=@{y1desription}}} {{name2=@{y1abilityname}}} {{icon1-@{y1icon1}=1}} {{icon2-@{y1icon2}=1}} {{icon3-@{y1icon3}=1}} {{type=Type: @{y1abilitytype}}} {{desc=@{y1abilitydesc}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
            <div class="col sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_y1_sourcebook" value="SCRPG:Core p90/96" style="width: 61%">
            </div>
        </div>
        <input type="hidden" class="direction" name="attr_y1direction" value="right" />
        <div class="eachform" style="border-style: solid; border-width: 1%; background-color: #ffff99;">
            <div class="2colrow">
                <div class="col" style="width: 30%;">
                    <h3>Powers</h3>
                    <fieldset class="repeating_y1powers">
                        <input type="text" name="attr_y1power" style="width: 65%; float: left;">
                        <select name="attr_y1powerdtype" style="width: 22%; float: left;">
                            <option value="d0" selected>-</option>
                            <option value="d4">d4</option>
                            <option value="d6">d6</option>
                            <option value="d8">d8</option>
                            <option value="d10">d10</option>
                            <option value="d12">d12</option>
                        </select>
                        <input type="checkbox" name="attr_y1powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
                    </fieldset>
                </div>
                <div class="col" style="width: 65%;">
                    <h3>Description</h3>
                    <textarea name="attr_y1desription" style="width: 98%; height: 41px;"></textarea>
                    <b>Icon</b>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_y1icon1" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_y1icon1_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_y1icon2" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_y1icon2_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_y1icon3" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_y1icon3_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span><div class="col" style="width: 1.5%;"></div></span>
                    <b>Name</b>
                    <input type="text" name="attr_y1abilityname" style="width: 39%;">
                    <span><div class="col" style="width: 80px; float: right">
                        <b>Type</b>
                        <select name="attr_y1abilitytype" style="width: 42px;">
                            <option value="Action">A</option>
                            <option value="Inherent">I</option>
                            <option value="Reaction">R</option>
                        </select>
                    </div></span>
                    <textarea name="attr_y1abilitydesc" style="width: 98%; height: 31px;"></textarea>
                </div>
            </div>
        </div>
        <div class="eachform" style="width: 100%; height: 15px;"></div>
    </div>
    <!-- y2 is Second Yellow Mode -->
    <div class="modey2">
        <div class="flexrow">
            <input type='hidden' class='tabstoggle' name='attr_sheetTab'  value='hero' />
            <input type="hidden" class="modeselect" name="attr_poweromode"  value="0" />
            <div class="mode0">
                <input type="radio" value="5" name="attr_moderadio" />
            </div>
            <input type="text" class="typed-head" name="attr_y2name">
            <input type="hidden" class="direction" name="attr_y2direction" value="right" />
            <button type="action" name="act_y2direction_toggle" class="direction">
                <span class="down" style="color: #ffff99;">▼</span>
                <span class="right"  style="color: #ffff99;">►</span>
            </button>
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="col nonsource">
                <button type='roll' class='rolldice' name='mode_y2_print' value='
                    &{template:scrpg} {{color-Yellow=1}} {{name=@{character_name}}} {{suffix= - @{y2name}}} {{desc1=@{y2desription}}} {{name2=@{y2abilityname}}} {{icon1-@{y2icon1}=1}} {{icon2-@{y2icon2}=1}} {{icon3-@{y2icon3}=1}} {{type=Type: @{y2abilitytype}}} {{desc=@{y2abilitydesc}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
            <div class="col sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_y2_sourcebook" value="SCRPG:Core p90/96" style="width: 61%">
            </div>
        </div>
        <input type="hidden" class="direction" name="attr_y2direction" value="right" />
        <div class="eachform" style="border-style: solid; border-width: 1%; background-color: #ffff99;">
            <div class="2colrow">
                <div class="col" style="width: 30%;">
                    <h3>Powers</h3>
                    <fieldset class="repeating_y2powers">
                        <input type="text" name="attr_y2power" style="width: 65%; float: left;">
                        <select name="attr_y2powerdtype" style="width: 22%; float: left;">
                            <option value="d0" selected>-</option>
                            <option value="d4">d4</option>
                            <option value="d6">d6</option>
                            <option value="d8">d8</option>
                            <option value="d10">d10</option>
                            <option value="d12">d12</option>
                        </select>
                        <input type="checkbox" name="attr_y2powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
                    </fieldset>
                </div>
                <div class="col" style="width: 65%;">
                    <h3>Description</h3>
                    <textarea name="attr_y2desription" style="width: 98%; height: 41px;"></textarea>
                    <b>Icon</b>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_y2icon1" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_y2icon1_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_y2icon2" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_y2icon2_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_y2icon3" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_y2icon3_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span><div class="col" style="width: 1.5%;"></div></span>
                    <b>Name</b>
                    <input type="text" name="attr_y2abilityname" style="width: 39%;">
                    <span><div class="col" style="width: 80px; float: right">
                        <b>Type</b>
                        <select name="attr_y2abilitytype" style="width: 42px;">
                            <option value="Action">A</option>
                            <option value="Inherent">I</option>
                            <option value="Reaction">R</option>
                        </select>
                    </div></span>
                    <textarea name="attr_y2abilitydesc" style="width: 98%; height: 31px;"></textarea>
                </div>
            </div>
        </div>
        <div class="eachform" style="width: 100%; height: 15px;"></div>
    </div>
    <!-- r1 is the Red Mode -->
    <div class="moder1">
        <div class="flexrow">
            <input type='hidden' class='tabstoggle' name='attr_sheetTab'  value='hero' />
            <input type="hidden" class="modeselect" name="attr_poweromode"  value="0" />
            <div class="mode0">
                <input type="radio" value="6" name="attr_moderadio" />
            </div>
            <input type="text" class="typed-head" name="attr_r1name">
            <input type="hidden" class="direction" name="attr_r1direction" value="right" />
            <button type="action" name="act_r1direction_toggle" class="direction">
                <span class="down" style="color: #f9beac;">▼</span>
                <span class="right"  style="color: #f9beac;">►</span>
            </button>
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="col nonsource">
                <button type='roll' class='rolldice' name='mode_r1_print' value='
                    &{template:scrpg} {{color-Red=1}} {{name=@{character_name}}} {{suffix= - @{r1name}}} {{desc1=@{r1desription}}} {{name2=@{r1abilityname}}} {{icon1-@{r1icon1}=1}} {{icon2-@{r1icon2}=1}} {{icon3-@{r1icon3}=1}} {{type=Type: @{r1abilitytype}}} {{desc=@{r1abilitydesc}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
            <div class="col sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_r1_sourcebook" value="SCRPG:Core p90/96" style="width: 61%">
            </div>
        </div>
        <input type="hidden" class="direction" name="attr_r1direction" value="right" />
        <div class="eachform" style="border-style: solid; border-width: 1%; background-color: #f9beac;">
            <div class="2colrow">
                <div class="col" style="width: 30%;">
                    <h3>Powers</h3>
                    <fieldset class="repeating_r1powers">
                        <input type="text" name="attr_r1power" style="width: 65%; float: left;">
                        <select name="attr_r1powerdtype" style="width: 22%; float: left;">
                            <option value="d0" selected>-</option>
                            <option value="d4">d4</option>
                            <option value="d6">d6</option>
                            <option value="d8">d8</option>
                            <option value="d10">d10</option>
                            <option value="d12">d12</option>
                        </select>
                        <input type="checkbox" name="attr_r1powercheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; float: left; margin-left: 5px;">
                    </fieldset>
                </div>
                <div class="col" style="width: 65%;">
                    <h3>Description</h3>
                    <textarea name="attr_r1desription" style="width: 98%; height: 41px;"></textarea>
                    <b>Icon</b>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_r1icon1" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_r1icon1_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_r1icon2" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_r1icon2_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span>
                        <div class="col" style="width: 47px;">
                            <input type="hidden" class="icon-cycle" name="attr_r1icon3" value=0 />
                            <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                            <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                            <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                            <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                            <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                            <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                            <div class="col" style="width: 25%; float: right;">
                                <button type="action" name="act_r1icon3_cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                            </div>
                        </div>
                    </span>
                    <span><div class="col" style="width: 1.5%;"></div></span>
                    <b>Name</b>
                    <input type="text" name="attr_r1abilityname" style="width: 39%;">
                    <span><div class="col" style="width: 80px; float: right">
                        <b>Type</b>
                        <select name="attr_r1abilitytype" style="width: 42px;">
                            <option value="Action">A</option>
                            <option value="Inherent">I</option>
                            <option value="Reaction">R</option>
                        </select>
                    </div></span>
                    <textarea name="attr_r1abilitydesc" style="width: 98%; height: 31px;"></textarea>
                </div>
            </div>
        </div>
        <div class="eachform" style="width: 100%; height: 15px;"></div>
    </div>
    <!-- Divided Options-->
    <div class="mode0">
        <div class="flexrow">
            <h2>Divided Options:</h2><div class="col" style="width: 5px;"></div>
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="col sourceinput"><b>*Sourcebook</b>
                <input type="text" name="attr_divided_sourcebook" value="SCRPG:Core p94-95" style="width: 61%">
            </div>
        </div>
        <div style="border-style: solid; border-width: 1%">
            <div class="dividedgrid">
                <input type="radio" value="0" name="attr_dividedradio" style="height: 35px" checked="true" />
                <div class="col"><h3>Character does not use Divided Template</h3></div>
                <div></div><div></div>
                <div class="sgreen">Green</div>
                <div class="syellow">Yellow</div>
                <div class="sred">Red</div>
                <input type="radio" value="1" name="attr_dividedradio" style="height: 35px" />
                <input type="text" class="typed-head" name="attr_divided1name" value="Character's Civilian Form" style="width: 80%">
                <input type="checkbox" name="attr_dividedcheck" style="width: 20px; height: 20px; margin: 0 auto; float: left;">
                <b>Use only Qualities</b>
                <div class="sgreen">
                    <select name="attr_greendtype" class="gdtype" style="width: 55px">
                        <option value="d0">-</option>
                        <option value="d6">d6</option>
                        <option value="d8">d8</option>
                        <option value="d10">d10</option>
                        <option value="d12">d12</option>
                    </select>
                </div>
                <div class="syellow">
                    <select name="attr_yellowdtype" class="ydtype" style="width: 55px">
                        <option value="d0">-</option>
                        <option value="d6">d6</option>
                        <option value="d8">d8</option>
                        <option value="d10">d10</option>
                        <option value="d12">d12</option>
                    </select>
                </div>
                <div class="sred">
                    <select name="attr_reddtype" class="rdtype" style="width: 55px">
                        <option value="d0">-</option>
                        <option value="d6">d6</option>
                        <option value="d8">d8</option>
                        <option value="d10">d10</option>
                        <option value="d12">d12</option>
                    </select>
                </div>
                <input type="radio" value="2" name="attr_dividedradio" style="height: 35px" />
                <input type="text" class="typed-head" name="attr_divided2name" value="Character's Heroic Form" style="width: 80%">
                <input type="checkbox" name="attr_dividedcheck" style="width: 20px; height: 20px; margin: 0 auto; float: left;">
                <b>Use only Powers</b>
                <div class="sgreen">
                    <select name="attr_green2dtype" class="gdtype" style="width: 55px">
                        <option value="d0">-</option>
                        <option value="d6">d6</option>
                        <option value="d8">d8</option>
                        <option value="d10">d10</option>
                        <option value="d12">d12</option>
                    </select>
                </div>
                <div class="syellow">
                    <select name="attr_yellow2dtype" class="ydtype" style="width: 55px">
                        <option value="d0">-</option>
                        <option value="d6">d6</option>
                        <option value="d8">d8</option>
                        <option value="d10">d10</option>
                        <option value="d12">d12</option>
                    </select>
                </div>
                <div class="sred">
                    <select name="attr_red2dtype" class="rdtype" style="width: 55px">
                        <option value="d0">-</option>
                        <option value="d6">d6</option>
                        <option value="d8">d8</option>
                        <option value="d10">d10</option>
                        <option value="d12">d12</option>
                    </select>
                </div>
            </div>
        </div>
    </div>
</div>
<div class='abilities villain'>
    <!-- ABILITIES (REPEATING) -->
    <input type='hidden' class='tabs2toggle' name='attr_sheetTab2'  value='abilities2' />
    <button type="action" class="abil2button" name="act_abilities2" >Abilities</button>
    <button type="action" class="acti2button" name="act_actions2" >Basic Actions</button>
    <div class='abilities2'>
        <!--Green Abilities -->
        <div class="green-abilities" style="border-style: solid; border-width: 0.5%;">
            <fieldset class="repeating_greenabilities">
                <b>Icon</b>
                <div class="col" style="width: 47px;">
                    <input type="hidden" class="icon-cycle" name="attr_icon1" value=0 />
                    <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                    <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                    <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                    <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                    <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                    <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                    <div class="col" style="width: 25%; float: right;">
                        <button type="action" name="act_icon1cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                    </div>
                </div>
                <div class="col" style="width: 47px;">
                    <input type="hidden" class="icon-cycle" name="attr_icon2" value=0 />
                    <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                    <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                    <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                    <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                    <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                    <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                    <div class="col" style="width: 25%; float: right;">
                        <button type="action" name="act_icon2cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                    </div>
                </div>
                <div class="col" style="width: 47px;">
                    <input type="hidden" class="icon-cycle" name="attr_icon3" value=0 />
                    <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                    <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                    <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                    <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                    <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                    <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                    <div class="col" style="width: 25%; float: right;">
                        <button type="action" name="act_icon3cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                    </div>
                </div>
                <div class="col" style="width: 5px;"></div>
                <input type="hidden" class="lock" name="attr_resourcebook" value="hide" />
                <div class="col nonsource" style="width: 10%;"></div>
                <div class="col" style="width: 36%;">
                    <b>Name</b>
                    <input type="text" name="attr_abilityname" style="width: 86%;">
                </div>
                <div class="col nonsource">
                    <input type='hidden' class='tabstoggle' name='attr_resheetTab'  value='hero' />
                    <div class='abilities'>
                        <button type='roll' class='rolldice' name='ability_print' value='
                            &{template:scrpg} {{color-Green=1}} {{name=@{character_name}}} {{suffix= - @{abilityname}}} {{icon1-@{icon1}=1}} {{icon2-@{icon2}=1}} {{icon3-@{icon3}=1}} {{type=Type: @{abilitytype}}} {{desc=@{greenabilitydesc}}}'>
                            <b><span style="font-family: 'Pictos'">/</span></b>
                        </button>
                    </div>
                    <div class='villain'>
                        <button type='roll' class='rolldice' name='ability_print' value='
                            &{template:scrpg} {{name=@{character_name}}} {{suffix= - @{abilityname}}} {{icon1-@{icon1}=1}} {{icon2-@{icon2}=1}} {{icon3-@{icon3}=1}} {{type=Type: @{abilitytype}}} {{desc=@{greenabilitydesc}}}'>
                            <b><span style="font-family: 'Pictos'">/</span></b>
                        </button>
                    </div>
                </div>
                <div class="col sourceinput" style="width: 25%;"><b>*Source</b>
                    <input type="text" name="attr_abilitysourcebook" value="SCRPG:Core pXX" style="width: 73%">
                </div>
                <div style="width: 105px; float: right;">
                    <b>Type</b>
                    <select name="attr_abilitytype" style="width: 40px;">
                        <option value="Action">A</option>
                        <option value="Inherent">I</option>
                        <option value="Reaction">R</option>
                    </select>
                </div>
                <textarea name="attr_greenabilitydesc" style="width: 95%; height: 31px;"></textarea>
            </fieldset>
        </div>
    </div>
    <div class='actions2'>
        <div class='descgrid' style="float: right; width: 100%; border-style: solid; border-width: 1%; background-color: #fde2c3;">
            <div class='col'>
                <div class='flexrow'>
                    <h3>Overcome</h3><div class="col" style="width: 5px;"></div>
                    <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
                    <div class="nonsource">
                        <button type='roll' class='rolldice' name='action_print' value='
                            &{template:default} {{name=Overcome}} {{Effect Die Result=Outcome}} {{0 or Less=Action utterly, spectacularly fails}} {{1-3=Action fails, or succeeds with a major twist}} {{4-7=Action succeeds, but with a minor twist}} {{8-11=Action completely succeeds}} {{12+=Action succeeds beyond expectations}}'>
                            <b><span style="font-family: 'Pictos'">/</span></b>
                        </button>
                    </div>
                    <div class="descinline sourceinput">SCRPG:Core p25</div>
                </div>
                <span>When your hero faces an obstacle or risky endeavor, one that carries a risk of failure, injury to a hero, or dire consequences, this requires the hero to Overcome the challenge.</span><br/>
                <span>Assemble your dice pool, roll those dice, and then compare your result to the following list:</span>
                <div class='flexrow'>
                    <div class="flexspace"></div>
                    <div class='descinline' style="width: 90%; border-style: solid; border-width: 1%; background-color: #ffffff;">
                        <span>Effect Die Result</span><span>Outcome</span>
                        <span>0 or Less</span><span>Action utterly, spectacularly fails</span>
                        <span>1-3</span><span>Action fails, or succeeds with a major twist</span>
                        <span>4-7</span><span>Action succeeds, but with a minor twist</span>
                        <span>8-11</span><span>Action completely succeeds</span>
                        <span>12+</span><span>Action succeeds beyond expectations</span>
                    </div>
                    <div class="flexspace"></div>
                </div>
                <span>When your hero takes a twist, you as a player decide if you’ll answer one of the questions under your principles (if appropriate to the scene) or you can let your GM decide an appropriate twist. A twist is always that: a plot twist, so work with your GM to determine an event that makes the story more interesting and moves the plot forward.</span>
                <div class='flexrow'>
                    <h3>Attack</h3><div class="col" style="width: 5px;"></div>
                    <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
                    <div class="descinline sourceinput">SCRPG:Core p24</div>
                </div>
                <span>If your hero tries to deals damage to another character, whether it’s physical (a series of punches), emotional (mocking taunts), or mental (psychic blasts), that’s an Attack.</span><br/>
                <span>Assemble your dice pool, and inflict damage to your target equal to that result. If the target is a character with a Health rating, they lose that much Health. If the target is a minion, they roll a minion save to see if you knock them out immediately or not.</span>
            </div>
            <div class='col'>
                <div class='flexrow'>
                    <h3>Boost or Hinder</h3><div class="col" style="width: 5px;"></div>
                    <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
                    <div class="nonsource">
                        <button type='roll' class='rolldice' name='action_print' value='
                            &{template:default} {{name=Boost or Hinder}} {{Effect Die Result=Mod Size}} {{0 or Less=No bonus or penalty is created}} {{1-3=+/- 1}} {{4-7=+/- 2}} {{8-11=+/- 3}} {{12+=+/- 4}}'>
                            <b><span style="font-family: 'Pictos'">/</span></b>
                        </button>
                    </div>
                    <div class="descinline sourceinput">SCRPG:Core p26</div>
                </div>
                When you Boost or Hinder, you make an effect called a mod. The Boost action creates a bonus for you or an ally; the Hinder action creates a penalty for an opponent.<br/>
                Assemble your dice pool, roll those dice, and then compare your result to the following list to determine the mod size:<br/>
                <div class='flexrow'>
                    <div class="flexspace"></div>
                    <div class='descinline' style="width: 90%; border-style: solid; border-width: 1%; background-color: #ffffff;">
                        <div style="width: 130px;">Effect Die Result</div><span>Mod Size</span>
                        <span>0 or Less</span><span>No bonus or penalty is created</span>
                        <span>1-3</span><span>+/- 1</span>
                        <span>4-7</span><span>+/- 2</span>
                        <span>8-11</span><span>+/- 3</span>
                        <span>12+</span><span>+/- 4</span>
                    </div>
                    <div class="flexspace"></div>
                </div>
                Any number of bonuses and penalties can be applied to a roll, except only one exclusive mod can be used on a roll. Bonuses or penalties only apply for one roll and then go away unless they are persistent or an ability dictates their duration.
                <div class='flexrow'>
                    <h3>Defend</h3><div class="col" style="width: 5px;"></div>
                    <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
                    <div class="descinline sourceinput">SCRPG:Core p28</div>
                </div>
                Your hero is always taking steps to protect themselves, but there are times when they want to focus on protecting themselves or someone else. In a Defend action, you describe what your hero is doing to avoid or reduce an Attack. Assemble your dice pool, roll those dice, and note your result. When you or the target you are Defending would next lose Health before your next turn, reduce the amount taken by your Defend result. If you or the target you’re Defending are not Attacked before your next turn, the effect is wasted.<br/>
                If you are under the effect of multiple Defend actions, choose the higher result to use; do not combine them.
            </div>
        </div>
    </div>
</div>
<div class='abilities'>
    <input type='hidden' class='tabs2toggle' name='attr_sheetTab2'  value='abilities2' />
    <div class='abilities2'>
        <!-- MORE ABILITIES (REPEATING) -->
        <div class="col" style="width: 100%; height: 15px;"></div>
        <!-- Yellow Abilities -->
        <div class="yellow-abilities" style="background-color: #ffff99; border-style: solid; border-width: 0.5%;">
            <fieldset class="repeating_yellowabilities">
                <b>Icon</b>
                <div class="col" style="width: 47px;">
                    <input type="hidden" class="icon-cycle" name="attr_icon1" value=0 />
                    <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                    <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                    <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                    <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                    <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                    <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                    <div class="col" style="width: 25%; float: right;">
                        <button type="action" name="act_icon1cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                    </div>
                </div>
                <div class="col" style="width: 47px;">
                    <input type="hidden" class="icon-cycle" name="attr_icon2" value=0 />
                    <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                    <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                    <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                    <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                    <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                    <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                    <div class="col" style="width: 25%; float: right;">
                        <button type="action" name="act_icon2cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                    </div>
                </div>
                <div class="col" style="width: 47px;">
                    <input type="hidden" class="icon-cycle" name="attr_icon3" value=0 />
                    <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                    <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                    <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                    <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                    <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                    <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                    <div class="col" style="width: 25%; float: right;">
                        <button type="action" name="act_icon3cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                    </div>
                </div>
                <div class="col" style="width: 5px;"></div>
                <input type="hidden" class="lock" name="attr_resourcebook" value="hide" />
                <div class="col nonsource" style="width: 10%;"></div>
                <div class="col" style="width: 36%;">
                    <b>Name</b>
                    <input type="text" name="attr_abilityname" style="width: 86%;">
                </div>
                <div class="col nonsource">
                    <button type='roll' class='rolldice' name='ability_print' value='
                        &{template:scrpg} {{color-Yellow=1}} {{name=@{character_name}}} {{suffix= - @{abilityname}}} {{icon1-@{icon1}=1}} {{icon2-@{icon2}=1}} {{icon3-@{icon3}=1}} {{type=Type: @{abilitytype}}} {{desc=@{yellowabilitydesc}}}'>
                        <b><span style="font-family: 'Pictos'">/</span></b>
                    </button>
                </div>
                <div class="col sourceinput" style="width: 25%;"><b>*Source</b>
                    <input type="text" name="attr_abilitysourcebook" value="SCRPG:Core pXX" style="width: 73%">
                </div>
                <div style="width: 105px; float: right;">
                    <b>Type</b>
                    <select name="attr_abilitytype" style="width: 40px;">
                        <option value="Action">A</option>
                        <option value="Inherent">I</option>
                        <option value="Reaction">R</option>
                    </select>
                </div>
                <textarea name="attr_yellowabilitydesc" style="width: 95%; height: 31px;"></textarea>
            </fieldset>
        </div>
        <div class="col" style="width: 100%; height: 15px;"></div>
        <!-- Red Abilities -->
        <div class="red-abilities" style="background-color: #f9beac; border-style: solid; border-width: 0.5%;">
            <fieldset class="repeating_redabilities">
                <b>Icon</b>
                <div class="col" style="width: 47px;">
                    <input type="hidden" class="icon-cycle" name="attr_icon1" value=0 />
                    <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                    <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                    <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                    <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                    <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                    <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                    <div class="col" style="width: 25%; float: right;">
                        <button type="action" name="act_icon1cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                    </div>
                </div>
                <div class="col" style="width: 47px;">
                    <input type="hidden" class="icon-cycle" name="attr_icon2" value=0 />
                    <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                    <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                    <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                    <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                    <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                    <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                    <div class="col" style="width: 25%; float: right;">
                        <button type="action" name="act_icon2cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                    </div>
                </div>
                <div class="col" style="width: 47px;">
                    <input type="hidden" class="icon-cycle" name="attr_icon3" value=0 />
                    <span class="attack"><img src="https://i.imgur.com/VdI1nGL.png" style="height: 35px; width: 35px;"></span>
                    <span class="defend"><img src="https://i.imgur.com/P74NrWI.png" style="height: 35px; width: 35px;"></span>
                    <span class="overcome"><img src="https://i.imgur.com/5Rc36P9.png" style="height: 35px; width: 35px;"></span>
                    <span class="boost"><img src="https://i.imgur.com/S2zULo6.png" style="height: 35px; width: 35px;"></span>
                    <span class="hinder"><img src="https://i.imgur.com/sgmZ0g5.png" style="height: 35px; width: 35px;"></span>
                    <span class="recover"><img src="https://i.imgur.com/714YUtO.png" style="height: 35px; width: 35px;"></span>
                    <div class="col" style="width: 25%; float: right;">
                        <button type="action" name="act_icon3cycle" class="icon-cycle" style="font-family: 'Pictos'">r</button>
                    </div>
                </div>
                <div class="col" style="width: 5px;"></div>
                <input type="hidden" class="lock" name="attr_resourcebook" value="hide" />
                <div class="col nonsource" style="width: 10%;"></div>
                <div class="col" style="width: 36%;">
                    <b>Name</b>
                    <input type="text" name="attr_abilityname" style="width: 86%;">
                </div>
                <div class="col nonsource">
                    <button type='roll' class='rolldice' name='ability_print' value='
                        &{template:scrpg} {{color-Red=1}} {{name=@{character_name}}} {{suffix= - @{abilityname}}} {{icon1-@{icon1}=1}} {{icon2-@{icon2}=1}} {{icon3-@{icon3}=1}} {{type=Type: @{abilitytype}}} {{desc=@{redabilitydesc}}}'>
                        <b><span style="font-family: 'Pictos'">/</span></b>
                    </button>
                </div>
                <div class="col sourceinput" style="width: 25%;"><b>*Source</b>
                    <input type="text" name="attr_abilitysourcebook" value="SCRPG:Core pXX" style="width: 73%">
                </div>
                <div style="width: 105px; float: right;">
                    <b>Type</b>
                    <select name="attr_abilitytype" style="width: 40px;">
                        <option value="Action">A</option>
                        <option value="Inherent">I</option>
                        <option value="Reaction">R</option>
                    </select>
                </div>
                <textarea name="attr_redabilitydesc" style="width: 95%; height: 31px;"></textarea>
            </fieldset>
        </div>
        <div class="col" style="width: 100%; height: 15px;"></div>
        <!-- Out Ability -->
        <div class="out-abilities" style="background-color: #bfbfbf; padding: 2px; border-style: solid; border-width: 0.5%;">
            <b>Out Ability</b>
            <input type="text" name="attr_outability" style="padding: 2px; width: 80%;">
            <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
            <div class="col nonsource">
                <button type='roll' class='rolldice' name='ability_print' value='
                    &{template:scrpg} {{color-out=1}} {{name=@{character_name}}} {{suffix= - Out Ability}} {{desc1=@{outability}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
            <div class="col sourceinput" style="width: 50%;">
                <div class="col" style="width: 75px;"></div><b>*Source</b>
                <input type="text" name="attr_outsourcebook" value="SCRPG:Core p101-104" style="width: 43%">
            </div>
        </div>
    </div>
</div>
<div class='minions'>
    <!-- MINIONS -->
    <div class="col" style="width: 40%;">
        <input class="col typed-head" type="text" name="attr_miniontype" style ="width: 75%;" value='Your Minions'>
        <input type="hidden" class="lock" name="attr_sourcebook" value="hide" />
        <div class="col nonsource">
            <button type='roll' class='rolldice' name='action_print' value='&{template:minion-print}'>
                <b><span style="font-family: 'Pictos'">/</span></b>
            </button>
        </div>
        <div class="col descinline sourceinput" style="font-size: 10px;">SCRPG:Core p87</div>
        <span>
            <div>
            <table style="width: 100% ; margin: 0 auto ; border-style: solid; border-width: 1%;">
                <tbody>
                    <tr style="background-color: #9c95d3">
                        <td style="width: 25%">KEY VALUE</td>
                        <td style="width: 25%">DIE TYPE</td>
                        <td style="width: 50%">EXAMPLE FORMS</td>
                    </tr>
                    <tr>
                        <td>0 or Less</td>
                        <td><img src="https://i.imgur.com/zKe7brQ.png" style="height: 25px; width: 25px;"> minion</td>
                        <td>tiny/featureless</td>
                    </tr>
                    <tr>
                        <td>1-3</td>
                        <td><img src="https://i.imgur.com/2wFSDlU.png" style="height: 25px; width: 25px;"> minion</td>
                        <td>small/limited detail</td>
                    </tr>
                    <tr>
                        <td>4-7</td>
                        <td><img src="https://i.imgur.com/BQuOtZf.png" style="height: 25px; width: 25px;"> minion</td>
                        <td>house pet sized/detailed</td>
                    </tr>
                    <tr>
                        <td>8-11</td>
                        <td><img src="https://i.imgur.com/dO59pvM.png" style="height: 25px; width: 25px;"> minion</td>
                        <td>humanoid sized/intracate</td>
                    </tr>
                    <tr>
                        <td>12+</td>
                        <td><img src="https://i.imgur.com/VMxuy5U.png" style="height: 25px; width: 25px;"> minion</td>
                        <td>large/paragon</td>
                    </tr>
                </tbody>
            </table>
            </div>
        </span>
    </div>
    <div class="col" style="width: 57%;">
        <input class="typed-head" type="text" name="attr_minionnotename" style ="width: 55%;" value='Notes'>
        <textarea name="attr_minionnotes" style="width: 98%; height: 150px;"></textarea>
    </div>
    <div class="col" style="width: 100%; height: 15px;"></div>
    <input class="typed-head" type="text" name="attr_minionform" style ="width: 30%;" value='Minion Forms'>
    <div class="minionforms" style="border-style: solid; border-width: 0.5%;">
        <div style="background-color: #9c95d3">
            <div class="col" style="width: 15%">NAME</div>
            <div class="col" style="width: 69%">DESCRIPTION</div>
            <div class="col" style="width: 15%">BONUS</div>
        </div>
        <fieldset class="repeating_minionforms">
            <div class="col" style="width: 15%">
                <input type="text" name="attr_mformname" style ="width: 100%;">
            </div>
            <div class="col" style="width: 69%">
                <input type="text" name="attr_mformdescription" style="width: 100%;">
            </div>
            <div class="col" style="width: 15%">
                <select name="attr_mformbonus" style ="width: 100%;">
                    <option>+1 or higher</option>
                    <option>+2 or higher</option>
                    <option>+3 or higher</option>
                    <option>+4 or higher</option>
                </select>
            </div>
            <input type="hidden" class="lock" name="attr_resourcebook" value="hide" />
            <div class="sourceinput" style="width: 25%;"><b>*Source</b>
                <input type="text" name="attr_minionsourcebook" value="SCRPG:Core p88" style="width: 73%">
            </div>
        </fieldset>
    </div>
</div>
<div class='environment'>
    <!-- ENVIRONMENT -->
    <!-- Status -->
    <input type='hidden' class='envirocolor' name='attr_status_chosen'  value='Out' />
    <div class="envirostatusgrid">
        <div style="height: 35px"></div>
        <div class="sgreen envirostatuscolor"><input type="checkbox" name="attr_greencheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; margin-left: 5px;">Green</div>
        <div class="syellow envirostatuscolor"><input type="checkbox" name="attr_yellowcheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; margin-left: 5px;">Yellow</div>
        <div class="sred envirostatuscolor"><input type="checkbox" name="attr_redcheck" value="1" style="width: 25px; height: 25px; margin: 0 auto; margin-left: 5px;">Red</div>
    </div>
    <!-- Environment Name -->
    <div class="col envirotitle" style="width: 49%; border-style: solid; border-width: 1%;">
        <h2 style="color: #ffffff;"><b>Environment Name</b></h2>
        <input class="detail-input" type="text" name="attr_character_name" style="width: 97%; font-weight: bold; font-size: xx-large;">
        <div style="width: 100%; height: 11px;"></div>
    </div>
    <!-- Traits -->
    <div class="col envirotitle" style="width: 49%; float: right; border-style: solid; border-width: 1%;">
        <div style="width: 97%">
            <div style="width: 100%; height: 3px;"></div>
            <div class="flexrow" style="width: 100%; height: 30px;">
                <div style="width: 1px"></div>
                <input type="text" class="flexspace" name="attr_eTrait1" style="width: 100%; float: left;">
                <select name="attr_eTrait1die" style="width: 20%; float: left;">
                <option value="d0" selected>-</option>
                <option value="d4">d4</option>
                <option value="d6">d6</option>
                <option value="d8">d8</option>
                <option value="d10">d10</option>
                <option value="d12">d12</option>
                </select>
                <button type='roll' class='rolldice' name='roll_power' value='
                    &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{die1-@{eTrait1die}=1}} {{r1name=@{eTrait1} - @{eTrait1die} = }} {{roll1=[[@{eTrait1die}cs>13cf<0]]}}'>
                    <b><span style="font-family: 'dicefontd10'">0</span></b>
                </button>
            </div>
            <div class="flexrow" style="width: 100%; height: 30px;">
                <div style="width: 1px"></div>
                <input type="text" name="attr_eTrait2" style="width: 100%; float: left;">
                <select name="attr_eTrait2die" style="width: 20%; float: left;">
                <option value="d0" selected>-</option>
                <option value="d4">d4</option>
                <option value="d6">d6</option>
                <option value="d8">d8</option>
                <option value="d10">d10</option>
                <option value="d12">d12</option>
                </select>
                <button type='roll' class='rolldice' name='roll_power' value='
                    &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{die2-@{eTrait2die}=1}} {{r2name=@{eTrait2} - @{eTrait2die} = }} {{roll2=[[@{eTrait2die}cs>13cf<0]]}}'>
                    <b><span style="font-family: 'dicefontd10'">0</span></b>
                </button>
            </div>
            <div class="flexrow" style="width: 100%; height: 30px;">
                <div style="width: 1px"></div>
                <input type="text" name="attr_eTrait3" style="width: 100%; float: left;">
                <select name="attr_eTrait3die" style="width: 20%; float: left;">
                <option value="d0" selected>-</option>
                <option value="d4">d4</option>
                <option value="d6">d6</option>
                <option value="d8">d8</option>
                <option value="d10">d10</option>
                <option value="d12">d12</option>
                </select>
                <button type='roll' class='rolldice' name='roll_power' value='
                    &{template:scrpg} {{color-@{status_chosen}=1}} {{name=@{character_name}}} {{die3-@{eTrait3die}=1}} {{r3name=@{eTrait3} - @{eTrait3die} = }} {{roll3=[[@{eTrait3die}cs>13cf<0]]}}'>
                    <b><span style="font-family: 'dicefontd10'">0</span></b>
                </button>
            </div>
        </div>
    </div>
    <!-- TWISTS (REPEATING) -->
    <h3>Twists</h3>
    <!--Green Twists -->
    <div class="green-twists" style="background-color: #46e35e; border-style: solid; border-width: 0.5%;">
        <fieldset class="repeating_greentwists">
            <div class="col" style="width: 5px;"></div>
            <select name="attr_twistsevere" style="width: 15%; float: left;">
                <option value="Minor Twist" selected>Minor Twist</option>
                <option value="Major Twist">Major Twist</option>
            </select>
            <div class="col" style="width: 5%;"></div>
            <div class="col" style="width: 36%;">
                <b>Name</b>
                <input type="text" name="attr_twistname" style="width: 86%;">
            </div>
            <input type="hidden" class="lock" name="attr_resourcebook" value="hide" />
            <div class="col nonsource">
                <button type='roll' class='rolldice' name='twist_print' value='
                    &{template:scrpg} {{color-Green=1}} {{name=@{character_name}}} {{suffix= - @{twistname}}} {{type=@{twistsevere}}} {{desc=@{twistdesc}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
            <div class="col" style="width: 5%;"></div>
            <div class="col sourceinput" style="width: 25%;"><b>*Source</b>
                <input type="text" name="attr_abilitysourcebook" value="SCRPG:Core p244-245" style="width: 73%">
            </div>
            <textarea name="attr_twistdesc" style="width: 95%; height: 31px;"></textarea>
        </fieldset>
    </div>
    <div class="col" style="width: 100%; height: 15px;"></div>
    <!--Yollow Twists -->
    <div class="yellow-twists" style="background-color: #ffff99; border-style: solid; border-width: 0.5%;">
        <fieldset class="repeating_yellowtwists">
            <div class="col" style="width: 5px;"></div>
            <select name="attr_twistsevere" style="width: 15%; float: left;">
                <option value="Minor Twist" selected>Minor Twist</option>
                <option value="Major Twist">Major Twist</option>
            </select>
            <div class="col" style="width: 5%;"></div>
            <div class="col" style="width: 36%;">
                <b>Name</b>
                <input type="text" name="attr_twistname" style="width: 86%;">
            </div>
            <input type="hidden" class="lock" name="attr_resourcebook" value="hide" />
            <div class="col nonsource">
                <button type='roll' class='rolldice' name='twist_print' value='
                    &{template:scrpg} {{color-Yellow=1}} {{name=@{character_name}}} {{suffix= - @{twistname}}} {{type=@{twistsevere}}} {{desc=@{twistdesc}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
            <div class="col" style="width: 5%;"></div>
            <div class="col sourceinput" style="width: 25%;"><b>*Source</b>
                <input type="text" name="attr_abilitysourcebook" value="SCRPG:Core p244-245" style="width: 73%">
            </div>
            <textarea name="attr_twistdesc" style="width: 95%; height: 31px;"></textarea>
        </fieldset>
    </div>
    <div class="col" style="width: 100%; height: 15px;"></div>
    <!--Red Twists -->
    <div class="red-twists" style="background-color: #f9beac; border-style: solid; border-width: 0.5%;">
        <fieldset class="repeating_redtwists">
            <div class="col" style="width: 5px;"></div>
            <select name="attr_twistsevere" style="width: 15%; float: left;">
                <option value="Minor Twist" selected>Minor Twist</option>
                <option value="Major Twist">Major Twist</option>
            </select>
            <div class="col" style="width: 5%;"></div>
            <div class="col" style="width: 36%;">
                <b>Name</b>
                <input type="text" name="attr_twistname" style="width: 86%;">
            </div>
            <input type="hidden" class="lock" name="attr_resourcebook" value="hide" />
            <div class="col nonsource">
                <button type='roll' class='rolldice' name='twist_print' value='
                    &{template:scrpg} {{color-Red=1}} {{name=@{character_name}}} {{suffix= - @{twistname}}} {{type=@{twistsevere}}} {{desc=@{twistdesc}}}'>
                    <b><span style="font-family: 'Pictos'">/</span></b>
                </button>
            </div>
            <div class="col" style="width: 5%;"></div>
            <div class="col sourceinput" style="width: 25%;"><b>*Source</b>
                <input type="text" name="attr_abilitysourcebook" value="SCRPG:Core p244-245" style="width: 73%">
            </div>
            <textarea name="attr_twistdesc" style="width: 95%; height: 31px;"></textarea>
        </fieldset>
    </div>
</div>
<span style="color: gray; float: right;">
    <em>Sentinel Comics RPG and all images used are property of Greater than Games. Visit their website at: https://greaterthangames.com/</em>
</span>

<rolltemplate class="sheet-rolltemplate-scrpg">
    <div class="sheet-scrpg-container">
        {{#color-Red}} <div class="sheet-rfill sheet-scrpg-title"> {{/color-Red}}
        {{#color-Yellow}} <div class="sheet-yfill sheet-scrpg-title"> {{/color-Yellow}}
        {{#color-Green}} <div class="sheet-gfill sheet-scrpg-title"> {{/color-Green}}
        {{^color-Red}}{{^color-Yellow}}{{^color-Green}}
            <div class="sheet-outfill sheet-scrpg-title">
        {{/color-Green}}{{/color-Yellow}}{{/color-Red}}
            {{name}}
            {{#divided}}
                {{#rollTotal() divided 1}} - {{divided1}}{{/rollTotal() divided 1}}
                {{#rollTotal() divided 2}} - {{divided2}}{{/rollTotal() divided 2}}
            {{/divided}}
            {{#modenum}}
                {{#rollTotal() modenum 1}} - {{mode1}}{{/rollTotal() modenum 1}}
                {{#rollTotal() modenum 2}} - {{mode2}}{{/rollTotal() modenum 2}}
                {{#rollTotal() modenum 3}} - {{mode3}}{{/rollTotal() modenum 3}}
                {{#rollTotal() modenum 4}} - {{mode4}}{{/rollTotal() modenum 4}}
                {{#rollTotal() modenum 5}} - {{mode5}}{{/rollTotal() modenum 5}}
                {{#rollTotal() modenum 6}} - {{mode6}}{{/rollTotal() modenum 6}}
            {{/modenum}}
            {{#suffix}}{{suffix}}{{/suffix}}
        </div>

        {{#desc1}} <div class="sheet-scrpg-desc">{{desc1}} </div> {{/desc1}}
        {{#name2}}
            {{#color-Red}} <div class="sheet-rfill sheet-scrpg-title">{{name2}} </div> {{/color-Red}}
            {{#color-Yellow}} <div class="sheet-yfill sheet-scrpg-title">{{name2}} </div> {{/color-Yellow}}
            {{#color-Green}} <div class="sheet-gfill sheet-scrpg-title">{{name2}} </div> {{/color-Green}}
            {{^color-Red}}{{^color-Yellow}}{{^color-Green}}
                <div class="sheet-outfill sheet-scrpg-title">{{name2}} </div>
            {{/color-Green}}{{/color-Yellow}}{{/color-Red}}
        {{/name2}}

        <div class="sheet-scrpg-icons">
            {{#die1-d4}}
                {{#rollTotal() roll1 1}}<img src="https://imgur.com/cfhZRJz.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 1}}
                {{#rollTotal() roll1 2}}<img src="https://imgur.com/olS9y1k.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 2}}
                {{#rollTotal() roll1 3}}<img src="https://imgur.com/1h0dIhK.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 3}}
                {{#rollTotal() roll1 4}}<img src="https://imgur.com/smDHMO4.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 4}}
            {{/die1-d4}}
            {{#die1-d6}}
                {{#rollTotal() roll1 1}}<img src="https://imgur.com/hnVzROO.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 1}}
                {{#rollTotal() roll1 2}}<img src="https://imgur.com/mlT1b2g.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 2}}
                {{#rollTotal() roll1 3}}<img src="https://imgur.com/eUHguGf.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 3}}
                {{#rollTotal() roll1 4}}<img src="https://imgur.com/zNcUdyr.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 4}}
                {{#rollTotal() roll1 5}}<img src="https://imgur.com/uAGdbvo.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 5}}
                {{#rollTotal() roll1 6}}<img src="https://imgur.com/DqXdsG4.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 6}}
            {{/die1-d6}}
            {{#die1-d8}}
                {{#rollTotal() roll1 1}}<img src="https://imgur.com/QyNWL9s.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 1}}
                {{#rollTotal() roll1 2}}<img src="https://imgur.com/pF6TFfe.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 2}}
                {{#rollTotal() roll1 3}}<img src="https://imgur.com/kodFv2q.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 3}}
                {{#rollTotal() roll1 4}}<img src="https://imgur.com/Q9MZosO.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 4}}
                {{#rollTotal() roll1 5}}<img src="https://imgur.com/4JOI476.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 5}}
                {{#rollTotal() roll1 6}}<img src="https://imgur.com/cd8AKb4.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 6}}
                {{#rollTotal() roll1 7}}<img src="https://imgur.com/zjLgZ9N.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 7}}
                {{#rollTotal() roll1 8}}<img src="https://imgur.com/p97gyrN.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 8}}
            {{/die1-d8}}
            {{#die1-d10}}
                {{#rollTotal() roll1 1}}<img src="https://imgur.com/rCX0ALY.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 1}}
                {{#rollTotal() roll1 2}}<img src="https://imgur.com/3SgPSVN.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 2}}
                {{#rollTotal() roll1 3}}<img src="https://imgur.com/QVwAhIC.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 3}}
                {{#rollTotal() roll1 4}}<img src="https://imgur.com/mrq2CyM.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 4}}
                {{#rollTotal() roll1 5}}<img src="https://imgur.com/0LeLE2J.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 5}}
                {{#rollTotal() roll1 6}}<img src="https://imgur.com/vXhsjzF.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 6}}
                {{#rollTotal() roll1 7}}<img src="https://imgur.com/oXh5JmI.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 7}}
                {{#rollTotal() roll1 8}}<img src="https://imgur.com/bLVFaHS.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 8}}
                {{#rollTotal() roll1 9}}<img src="https://imgur.com/4SwmqnH.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 9}}
                {{#rollTotal() roll1 10}}<img src="https://imgur.com/66XuMig.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 10}}
            {{/die1-d10}}
            {{#die1-d12}}
                {{#rollTotal() roll1 1}}<img src="https://imgur.com/5aOzI7v.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 1}}
                {{#rollTotal() roll1 2}}<img src="https://imgur.com/Hpllu4a.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 2}}
                {{#rollTotal() roll1 3}}<img src="https://imgur.com/jKYiTO1.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 3}}
                {{#rollTotal() roll1 4}}<img src="https://imgur.com/TIyaQOC.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 4}}
                {{#rollTotal() roll1 5}}<img src="https://imgur.com/2zyHrXi.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 5}}
                {{#rollTotal() roll1 6}}<img src="https://imgur.com/vu1ojvi.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 6}}
                {{#rollTotal() roll1 7}}<img src="https://imgur.com/6QMufB5.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 7}}
                {{#rollTotal() roll1 8}}<img src="https://imgur.com/jW1B1bQ.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 8}}
                {{#rollTotal() roll1 9}}<img src="https://imgur.com/rhAAcWa.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 9}}
                {{#rollTotal() roll1 10}}<img src="https://imgur.com/Mz6KPvr.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 10}}
                {{#rollTotal() roll1 11}}<img src="https://imgur.com/2P0EOTx.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 11}}
                {{#rollTotal() roll1 12}}<img src="https://imgur.com/q7FD0AX.png" style="height: 50px; width: 50px;">{{/rollTotal() roll1 12}}
            {{/die1-d12}}

            {{#die2-d4}}
                {{#rollTotal() roll2 1}}<img src="https://imgur.com/cfhZRJz.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 1}}
                {{#rollTotal() roll2 2}}<img src="https://imgur.com/olS9y1k.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 2}}
                {{#rollTotal() roll2 3}}<img src="https://imgur.com/1h0dIhK.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 3}}
                {{#rollTotal() roll2 4}}<img src="https://imgur.com/smDHMO4.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 4}}
            {{/die2-d4}}
            {{#die2-d6}}
                {{#rollTotal() roll2 1}}<img src="https://imgur.com/hnVzROO.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 1}}
                {{#rollTotal() roll2 2}}<img src="https://imgur.com/mlT1b2g.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 2}}
                {{#rollTotal() roll2 3}}<img src="https://imgur.com/eUHguGf.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 3}}
                {{#rollTotal() roll2 4}}<img src="https://imgur.com/zNcUdyr.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 4}}
                {{#rollTotal() roll2 5}}<img src="https://imgur.com/uAGdbvo.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 5}}
                {{#rollTotal() roll2 6}}<img src="https://imgur.com/DqXdsG4.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 6}}
            {{/die2-d6}}
            {{#die2-d8}}
                {{#rollTotal() roll2 1}}<img src="https://imgur.com/QyNWL9s.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 1}}
                {{#rollTotal() roll2 2}}<img src="https://imgur.com/pF6TFfe.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 2}}
                {{#rollTotal() roll2 3}}<img src="https://imgur.com/kodFv2q.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 3}}
                {{#rollTotal() roll2 4}}<img src="https://imgur.com/Q9MZosO.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 4}}
                {{#rollTotal() roll2 5}}<img src="https://imgur.com/4JOI476.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 5}}
                {{#rollTotal() roll2 6}}<img src="https://imgur.com/cd8AKb4.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 6}}
                {{#rollTotal() roll2 7}}<img src="https://imgur.com/zjLgZ9N.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 7}}
                {{#rollTotal() roll2 8}}<img src="https://imgur.com/p97gyrN.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 8}}
            {{/die2-d8}}
            {{#die2-d10}}
                {{#rollTotal() roll2 1}}<img src="https://imgur.com/rCX0ALY.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 1}}
                {{#rollTotal() roll2 2}}<img src="https://imgur.com/3SgPSVN.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 2}}
                {{#rollTotal() roll2 3}}<img src="https://imgur.com/QVwAhIC.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 3}}
                {{#rollTotal() roll2 4}}<img src="https://imgur.com/mrq2CyM.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 4}}
                {{#rollTotal() roll2 5}}<img src="https://imgur.com/0LeLE2J.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 5}}
                {{#rollTotal() roll2 6}}<img src="https://imgur.com/vXhsjzF.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 6}}
                {{#rollTotal() roll2 7}}<img src="https://imgur.com/oXh5JmI.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 7}}
                {{#rollTotal() roll2 8}}<img src="https://imgur.com/bLVFaHS.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 8}}
                {{#rollTotal() roll2 9}}<img src="https://imgur.com/4SwmqnH.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 9}}
                {{#rollTotal() roll2 10}}<img src="https://imgur.com/66XuMig.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 10}}
            {{/die2-d10}}
            {{#die2-d12}}
                {{#rollTotal() roll2 1}}<img src="https://imgur.com/5aOzI7v.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 1}}
                {{#rollTotal() roll2 2}}<img src="https://imgur.com/Hpllu4a.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 2}}
                {{#rollTotal() roll2 3}}<img src="https://imgur.com/jKYiTO1.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 3}}
                {{#rollTotal() roll2 4}}<img src="https://imgur.com/TIyaQOC.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 4}}
                {{#rollTotal() roll2 5}}<img src="https://imgur.com/2zyHrXi.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 5}}
                {{#rollTotal() roll2 6}}<img src="https://imgur.com/vu1ojvi.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 6}}
                {{#rollTotal() roll2 7}}<img src="https://imgur.com/6QMufB5.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 7}}
                {{#rollTotal() roll2 8}}<img src="https://imgur.com/jW1B1bQ.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 8}}
                {{#rollTotal() roll2 9}}<img src="https://imgur.com/rhAAcWa.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 9}}
                {{#rollTotal() roll2 10}}<img src="https://imgur.com/Mz6KPvr.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 10}}
                {{#rollTotal() roll2 11}}<img src="https://imgur.com/2P0EOTx.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 11}}
                {{#rollTotal() roll2 12}}<img src="https://imgur.com/q7FD0AX.png" style="height: 50px; width: 50px;">{{/rollTotal() roll2 12}}
            {{/die2-d12}}

            {{#die3-d4}}
                {{#rollTotal() roll3 1}}<img src="https://imgur.com/cfhZRJz.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 1}}
                {{#rollTotal() roll3 2}}<img src="https://imgur.com/olS9y1k.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 2}}
                {{#rollTotal() roll3 3}}<img src="https://imgur.com/1h0dIhK.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 3}}
                {{#rollTotal() roll3 4}}<img src="https://imgur.com/smDHMO4.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 4}}
            {{/die3-d4}}
            {{#die3-d6}}
                {{#rollTotal() roll3 1}}<img src="https://imgur.com/hnVzROO.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 1}}
                {{#rollTotal() roll3 2}}<img src="https://imgur.com/mlT1b2g.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 2}}
                {{#rollTotal() roll3 3}}<img src="https://imgur.com/eUHguGf.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 3}}
                {{#rollTotal() roll3 4}}<img src="https://imgur.com/zNcUdyr.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 4}}
                {{#rollTotal() roll3 5}}<img src="https://imgur.com/uAGdbvo.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 5}}
                {{#rollTotal() roll3 6}}<img src="https://imgur.com/DqXdsG4.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 6}}
            {{/die3-d6}}
            {{#die3-d8}}
                {{#rollTotal() roll3 1}}<img src="https://imgur.com/QyNWL9s.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 1}}
                {{#rollTotal() roll3 2}}<img src="https://imgur.com/pF6TFfe.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 2}}
                {{#rollTotal() roll3 3}}<img src="https://imgur.com/kodFv2q.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 3}}
                {{#rollTotal() roll3 4}}<img src="https://imgur.com/Q9MZosO.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 4}}
                {{#rollTotal() roll3 5}}<img src="https://imgur.com/4JOI476.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 5}}
                {{#rollTotal() roll3 6}}<img src="https://imgur.com/cd8AKb4.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 6}}
                {{#rollTotal() roll3 7}}<img src="https://imgur.com/zjLgZ9N.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 7}}
                {{#rollTotal() roll3 8}}<img src="https://imgur.com/p97gyrN.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 8}}
            {{/die3-d8}}
            {{#die3-d10}}
                {{#rollTotal() roll3 1}}<img src="https://imgur.com/rCX0ALY.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 1}}
                {{#rollTotal() roll3 2}}<img src="https://imgur.com/3SgPSVN.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 2}}
                {{#rollTotal() roll3 3}}<img src="https://imgur.com/QVwAhIC.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 3}}
                {{#rollTotal() roll3 4}}<img src="https://imgur.com/mrq2CyM.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 4}}
                {{#rollTotal() roll3 5}}<img src="https://imgur.com/0LeLE2J.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 5}}
                {{#rollTotal() roll3 6}}<img src="https://imgur.com/vXhsjzF.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 6}}
                {{#rollTotal() roll3 7}}<img src="https://imgur.com/oXh5JmI.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 7}}
                {{#rollTotal() roll3 8}}<img src="https://imgur.com/bLVFaHS.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 8}}
                {{#rollTotal() roll3 9}}<img src="https://imgur.com/4SwmqnH.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 9}}
                {{#rollTotal() roll3 10}}<img src="https://imgur.com/66XuMig.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 10}}
            {{/die3-d10}}
            {{#die3-d12}}
                {{#rollTotal() roll3 1}}<img src="https://imgur.com/5aOzI7v.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 1}}
                {{#rollTotal() roll3 2}}<img src="https://imgur.com/Hpllu4a.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 2}}
                {{#rollTotal() roll3 3}}<img src="https://imgur.com/jKYiTO1.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 3}}
                {{#rollTotal() roll3 4}}<img src="https://imgur.com/TIyaQOC.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 4}}
                {{#rollTotal() roll3 5}}<img src="https://imgur.com/2zyHrXi.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 5}}
                {{#rollTotal() roll3 6}}<img src="https://imgur.com/vu1ojvi.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 6}}
                {{#rollTotal() roll3 7}}<img src="https://imgur.com/6QMufB5.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 7}}
                {{#rollTotal() roll3 8}}<img src="https://imgur.com/jW1B1bQ.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 8}}
                {{#rollTotal() roll3 9}}<img src="https://imgur.com/rhAAcWa.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 9}}
                {{#rollTotal() roll3 10}}<img src="https://imgur.com/Mz6KPvr.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 10}}
                {{#rollTotal() roll3 11}}<img src="https://imgur.com/2P0EOTx.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 11}}
                {{#rollTotal() roll3 12}}<img src="https://imgur.com/q7FD0AX.png" style="height: 50px; width: 50px;">{{/rollTotal() roll3 12}}
            {{/die3-d12}}

            <!--
            {{#die3-d4}}<img src="https://imgur.com/9h4LaAg.png" style="height: 50px; width: 50px;">{{/die3-d4}}
            {{#die3-d6}}<img src="https://imgur.com/BJbrfZZ.png" style="height: 50px; width: 50px;">{{/die3-d6}}
            {{#die3-d8}}<img src="https://imgur.com/rN6DAW0.png" style="height: 50px; width: 50px;">{{/die3-d8}}
            {{#die3-d10}}<img src="https://imgur.com/BOnGFrp.png" style="height: 50px; width: 50px;">{{/die3-d10}}
            {{#die3-d12}}<img src="https://imgur.com/AGtDDKb.png" style="height: 50px; width: 50px;">{{/die3-d12}}
            -->


            {{#icon1-1}} <img src="https://i.imgur.com/VdI1nGL.png" style="height: 50px; width: 50px;"> {{/icon1-1}}
            {{#icon1-2}} <img src="https://i.imgur.com/P74NrWI.png" style="height: 50px; width: 50px;"> {{/icon1-2}}
            {{#icon1-3}} <img src="https://i.imgur.com/5Rc36P9.png" style="height: 50px; width: 50px;"> {{/icon1-3}}
            {{#icon1-4}} <img src="https://i.imgur.com/S2zULo6.png" style="height: 50px; width: 50px;"> {{/icon1-4}}
            {{#icon1-5}} <img src="https://i.imgur.com/sgmZ0g5.png" style="height: 50px; width: 50px;"> {{/icon1-5}}
            {{#icon1-6}} <img src="https://i.imgur.com/714YUtO.png" style="height: 50px; width: 50px;"> {{/icon1-6}}

            {{#icon2-1}} <img src="https://i.imgur.com/VdI1nGL.png" style="height: 50px; width: 50px;"> {{/icon2-1}}
            {{#icon2-2}} <img src="https://i.imgur.com/P74NrWI.png" style="height: 50px; width: 50px;"> {{/icon2-2}}
            {{#icon2-3}} <img src="https://i.imgur.com/5Rc36P9.png" style="height: 50px; width: 50px;"> {{/icon2-3}}
            {{#icon2-4}} <img src="https://i.imgur.com/S2zULo6.png" style="height: 50px; width: 50px;"> {{/icon2-4}}
            {{#icon2-5}} <img src="https://i.imgur.com/sgmZ0g5.png" style="height: 50px; width: 50px;"> {{/icon2-5}}
            {{#icon2-6}} <img src="https://i.imgur.com/714YUtO.png" style="height: 50px; width: 50px;"> {{/icon2-6}}

            {{#icon3-1}} <img src="https://i.imgur.com/VdI1nGL.png" style="height: 50px; width: 50px;"> {{/icon3-1}}
            {{#icon3-2}} <img src="https://i.imgur.com/P74NrWI.png" style="height: 50px; width: 50px;"> {{/icon3-2}}
            {{#icon3-3}} <img src="https://i.imgur.com/5Rc36P9.png" style="height: 50px; width: 50px;"> {{/icon3-3}}
            {{#icon3-4}} <img src="https://i.imgur.com/S2zULo6.png" style="height: 50px; width: 50px;"> {{/icon3-4}}
            {{#icon3-5}} <img src="https://i.imgur.com/sgmZ0g5.png" style="height: 50px; width: 50px;"> {{/icon3-5}}
            {{#icon3-6}} <img src="https://i.imgur.com/714YUtO.png" style="height: 50px; width: 50px;"> {{/icon3-6}}
        </div>

        <div class="sheet-scrpg-type"> {{type}} </div>

        {{#color-Red}} <div class="sheet-rfill sheet-scrpg-desc"> {{/color-Red}}
        {{#color-Yellow}} <div class="sheet-yfill sheet-scrpg-desc"> {{/color-Yellow}}
        {{#color-Green}} <div class="sheet-gfill sheet-scrpg-desc"> {{/color-Green}}
        {{^color-Red}}{{^color-Yellow}}{{^color-Green}}
            <div class="sheet-outfill sheet-scrpg-desc">
        {{/color-Green}}{{/color-Yellow}}{{/color-Red}}
            <table style="width: 100%;">
                <tr style="background-color: #f6f0df">
                    <td style="width: 90%"></td>
                    <td style="width: 19%"></td>
                </tr>
                {{#roll1}}<tr>
                    <td style="font-weight: bold; text-align: right;">{{r1name}}</td>
                    <td>{{roll1}}</td>
                </tr>{{/roll1}}
                {{#roll2}}<tr>
                    <td style="font-weight: bold; text-align: right;">{{r2name}}</td>
                    <td>{{roll2}}</td>
                </tr>{{/roll2}}
                {{#roll3}}<tr>
                    <td style="font-weight: bold; text-align: right;">{{r3name}}</td>
                    <td>{{roll3}}</td>
                </tr>{{/roll3}}
            </table>
            {{#desc}}{{desc}}{{/desc}}
        </div>
    </div>
</rolltemplate>

<rolltemplate class="sheet-rolltemplate-minion-print">
    <table style="width: 100% ; margin: 0 auto ; border-style: solid; border-width: 1%; background-color: #f6f0df;">
        <tbody>
            <tr style="background-color: #9c95d3; font-weight: bold; font-size: 14px;">
                <td style="width: 25%">KEY VALUE</td>
                <td style="width: 25%">DIE TYPE</td>
                <td style="width: 50%">EXAMPLE FORMS</td>
            </tr>
            <tr>
                <td style="font-weight: bold;">0 or Less</td>
                <td><img src="https://i.imgur.com/zKe7brQ.png" style="height: 40px; width: 40px;"></td>
                <td>tiny/featureless</td>
            </tr>
            <tr>
                <td style="font-weight: bold;">1-3</td>
                <td><img src="https://i.imgur.com/2wFSDlU.png" style="height: 40px; width: 40px;"></td>
                <td>small/limited detail</td>
            </tr>
            <tr>
                <td style="font-weight: bold;">4-7</td>
                <td><img src="https://i.imgur.com/BQuOtZf.png" style="height: 40px; width: 40px;"></td>
                <td>house pet sized/detailed</td>
            </tr>
            <tr>
                <td style="font-weight: bold;">8-11</td>
                <td><img src="https://i.imgur.com/dO59pvM.png" style="height: 40px; width: 40px;"></td>
                <td>humanoid sized/intracate</td>
            </tr>
            <tr>
                <td style="font-weight: bold;">12+</td>
                <td><img src="https://i.imgur.com/VMxuy5U.png" style="height: 40px; width: 40px;"></td>
                <td>large/paragon</td>
            </tr>
        </tbody>
    </table>
</rolltemplate>

<script type="text/worker">
    //Buttons for Tabs
    const buttonlist = ["hero","abilities","auxiliary","minions","villain","environment"];
    buttonlist.forEach(button => {
        on(`clicked:${button}`, function() {
            setAttrs({
                sheetTab: button,
                sheetTab2: "abilities2"
            });
        });
    });
    const buttonlist2 = ["abilities2","actions2"];
    buttonlist2.forEach(button => {
        on(`clicked:${button}`, function() {
            setAttrs({
                sheetTab2: button
            });
        });
    });

    //CODE FOR changing the aux radio by form checks
    on("change:g1check", function(eventInfo) {
        getAttrs(["g1check"],function(v) {
            let check = parseInt(v.g1check)||0;
            if(check === 1) {
                setAttrs({
                    "moderadio":1,
                    "g1check":0
                });
            }
        });
    });
    on("change:g2check", function(eventInfo) {
        getAttrs(["g2check"],function(v) {
            let check = parseInt(v.g2check)||0;
            if(check === 1) {
                setAttrs({
                    "moderadio":2,
                    "g2check":0
                });
            }
        });
    });
    on("change:g3check", function(eventInfo) {
        getAttrs(["g3check"],function(v) {
            let check = parseInt(v.g3check)||0;
            if(check === 1) {
                setAttrs({
                    "moderadio":3,
                    "g3check":0
                });
            }
        });
    });
    on("change:y1check", function(eventInfo) {
        getAttrs(["y1check"],function(v) {
            let check = parseInt(v.y1check)||0;
            if(check === 1) {
                setAttrs({
                    "moderadio":4,
                    "y1check":0
                });
            }
        });
    });
    on("change:y2check", function(eventInfo) {
        getAttrs(["y2check"],function(v) {
            let check = parseInt(v.y2check)||0;
            if(check === 1) {
                setAttrs({
                    "moderadio":5,
                    "y2check":0
                });
            }
        });
    });
    on("change:r1check", function(eventInfo) {
        getAttrs(["r1check"],function(v) {
            let check = parseInt(v.r1check)||0;
            if(check === 1) {
                setAttrs({
                    "moderadio":6,
                    "r1check":0
                });
            }
        });
    });
    //When the aux radio changes, also change hidden value
    on("change:moderadio", function(eventInfo) {
        getAttrs(["moderadio"],function(v) {
            let modenum = parseInt(v.moderadio)||0;
            setAttrs({
                "poweromode": modenum,
            });
        });
    });

    //Toggles between Divided Forms
    on("clicked:divided_toggle", function() {getAttrs(["dividedradio"], function(v) {
        setAttrs({"dividedradio": v["dividedradio"] !== "1" ? "1" : "2"});
    });});
    //When the divided radio changes, also change hidden value
    on("change:dividedradio", function(eventInfo) {
        getAttrs(["dividedradio"],function(v) {
            let divnum = parseInt(v.dividedradio)||0;
            setAttrs({
                "civilianoheroic": divnum,
            });
        });
    });
    //CODE FOR SETTING/GETTING STATUS VALUES
    on("change:dividedcheck", function(eventInfo) {
        getAttrs(["dividedcheck"],function(v) {
            let value = v.dividedcheck;
            setAttrs({
                "usingdouble": value,
            });
        });
    });

    //CODE FOR SETTING/GETTING POWER VALUES from REPEATING SECTIONS from Aux g1-r1
    on("change:repeating_g1powers:g1powercheck", function(eventInfo) {
       getAttrs(["repeating_g1powers_g1power","repeating_g1powers_g1powerdtype","repeating_g1powers_g1powercheck"],function(v) {
           let check = parseInt(v.repeating_g1powers_g1powercheck)||0;
            if(check === 1) {
                let power = v.repeating_g1powers_g1power;
                let value = v.repeating_g1powers_g1powerdtype;
                setAttrs({
                    "power_chosen": power,
                    "power_value": value,
          		    "repeating_g1powers_g1powercheck":0
    	        });
            }
       });
    });
    on("change:repeating_g2powers:g2powercheck", function(eventInfo) {
       getAttrs(["repeating_g2powers_g2power","repeating_g2powers_g2powerdtype","repeating_g2powers_g2powercheck"],function(v) {
           let check = parseInt(v.repeating_g2powers_g2powercheck)||0;
            if(check === 1) {
                let power = v.repeating_g2powers_g2power;
                let value = v.repeating_g2powers_g2powerdtype;
                setAttrs({
                    "power_chosen": power,
                    "power_value": value,
          		    "repeating_g2powers_g2powercheck":0
    	        });
            }
       });
    });
    on("change:repeating_g3powers:g3powercheck", function(eventInfo) {
       getAttrs(["repeating_g3powers_g3power","repeating_g3powers_g3powerdtype","repeating_g3powers_g3powercheck"],function(v) {
           let check = parseInt(v.repeating_g3powers_g3powercheck)||0;
            if(check === 1) {
                let power = v.repeating_g3powers_g3power;
                let value = v.repeating_g3powers_g3powerdtype;
                setAttrs({
                    "power_chosen": power,
                    "power_value": value,
          		    "repeating_g3powers_g3powercheck":0
    	        });
            }
       });
    });
    on("change:repeating_y1powers:y1powercheck", function(eventInfo) {
       getAttrs(["repeating_y1powers_y1power","repeating_y1powers_y1powerdtype","repeating_y1powers_y1powercheck"],function(v) {
           let check = parseInt(v.repeating_y1powers_y1powercheck)||0;
            if(check === 1) {
                let power = v.repeating_y1powers_y1power;
                let value = v.repeating_y1powers_y1powerdtype;
                setAttrs({
                    "power_chosen": power,
                    "power_value": value,
          		    "repeating_y1powers_y1powercheck":0
    	        });
            }
       });
    });
    on("change:repeating_y2powers:y2powercheck", function(eventInfo) {
       getAttrs(["repeating_y2powers_y2power","repeating_y2powers_y2powerdtype","repeating_y2powers_y2powercheck"],function(v) {
           let check = parseInt(v.repeating_y2powers_y2powercheck)||0;
            if(check === 1) {
                let power = v.repeating_y2powers_y2power;
                let value = v.repeating_y2powers_y2powerdtype;
                setAttrs({
                    "power_chosen": power,
                    "power_value": value,
          		    "repeating_y2powers_y2powercheck":0
    	        });
            }
       });
    });
    on("change:repeating_r1powers:r1powercheck", function(eventInfo) {
       getAttrs(["repeating_r1powers_r1power","repeating_r1powers_r1powerdtype","repeating_r1powers_r1powercheck"],function(v) {
           let check = parseInt(v.repeating_r1powers_r1powercheck)||0;
            if(check === 1) {
                let power = v.repeating_r1powers_r1power;
                let value = v.repeating_r1powers_r1powerdtype;
                setAttrs({
                    "power_chosen": power,
                    "power_value": value,
          		    "repeating_r1powers_r1powercheck":0
    	        });
            }
       });
    });

    //CODE FOR SETTING/GETTING POWER VALUES from REPEATING SECTIONS
    on("change:repeating_powers:powercheck", function(eventInfo) {
        getAttrs(["repeating_powers_power","repeating_powers_powerdtype","repeating_powers_powercheck"],function(v) {
            let check = parseInt(v.repeating_powers_powercheck)||0;
            if(check === 1) {
                let power = v.repeating_powers_power;
                let value = v.repeating_powers_powerdtype;
                setAttrs({
                    "power_chosen": power,
                    "power_value": value,
                    "repeating_powers_powercheck":0
                });
            }
        });
    });
    //CODE FOR SETTING/GETTING QUALITY VALUES from REPEATING SECTIONS
    on("change:repeating_qualities:qualitycheck", function(eventInfo) {
       getAttrs(["repeating_qualities_quality","repeating_qualities_qualitydtype","repeating_qualities_qualitycheck"],function(v) {
           let check = parseInt(v.repeating_qualities_qualitycheck)||0;
            if(check === 1) {
                let quality = v.repeating_qualities_quality;
                let value = v.repeating_qualities_qualitydtype;
                setAttrs({
                    "quality_chosen": quality,
                    "quality_value": value,
          		    "repeating_qualities_qualitycheck":0
    	        });
            }
       });
    });
    //CODE FOR SETTING/GETTING POWER VALUES from REPEATING SECTIONS (in 2nd column for Divided)
    on("change:repeating_powers:qualitycheck", function(eventInfo) {
        getAttrs(["repeating_powers_power","repeating_powers_powerdtype","repeating_powers_qualitycheck"],function(v) {
            let check = parseInt(v.repeating_powers_qualitycheck)||0;
            if(check === 1) {
                let quality = v.repeating_powers_power;
                let value = v.repeating_powers_powerdtype;
                setAttrs({
                    "quality_chosen": quality,
                    "quality_value": value,
                    "repeating_powers_qualitycheck":0
                });
            }
        });
    });
    //CODE FOR SETTING/GETTING QUALITY VALUES from REPEATING SECTIONS (in 1st column for Divided)
    on("change:repeating_qualities:powercheck", function(eventInfo) {
       getAttrs(["repeating_qualities_quality","repeating_qualities_qualitydtype","repeating_qualities_powercheck"],function(v) {
           let check = parseInt(v.repeating_qualities_powercheck)||0;
            if(check === 1) {
                let power = v.repeating_qualities_quality;
                let value = v.repeating_qualities_qualitydtype;
                setAttrs({
                    "power_chosen": power,
                    "power_value": value,
          		    "repeating_qualities_powercheck":0
    	        });
            }
       });
    });


    //CODE FOR SETTING/GETTING STATUS VALUES
    on("change:greencheck", function(eventInfo) {
        getAttrs(["greendtype","green2dtype","greencheck","dividedradio"],function(v) {
            let check = parseInt(v.greencheck)||0;
            if(check === 1) {
                let value = parseInt(v.dividedradio)||0;
                if(value == 2) {
                    value = v.green2dtype;
                } else {
                    value = v.greendtype;
                }
                setAttrs({
                    "status_chosen": "Green",
                    "status_value": value,
                    "greencheck":0
                });
            }
        });
    });
    on("change:yellowcheck", function(eventInfo) {
       getAttrs(["yellowdtype","yellow2dtype","yellowcheck","dividedradio"],function(v) {
           let check = parseInt(v.yellowcheck)||0;
            if(check === 1) {
                let value = parseInt(v.dividedradio)||0;
                if(value == 2) {
                    value = v.yellow2dtype;
                } else {
                    value = v.yellowdtype;
                }
                setAttrs({
                    "status_chosen": "Yellow",
                    "status_value": value,
          		    "yellowcheck":0
    	        });
            }
       });
    });
    on("change:redcheck", function(eventInfo) {
       getAttrs(["reddtype","red2dtype","redcheck","dividedradio"],function(v) {
           let check = parseInt(v.redcheck)||0;
            if(check === 1) {
                let value = parseInt(v.dividedradio)||0;
                if(value == 2) {
                    value = v.red2dtype;
                } else {
                    value = v.reddtype;
                }
                setAttrs({
                    "status_chosen": "Red",
                    "status_value": value,
          		    "redcheck":0
    	        });
            }
       });
    });
    on("change:outcheck", function(eventInfo) {
       getAttrs(["outcheck"],function(v) {
           let check = parseInt(v.outcheck)||0;
            if(check === 1) {
                setAttrs({
                    "status_chosen": "Out",
                    "status_value": "d0",
          		    "outcheck":0
    	        });
            }
       });
    });

    //CODE FOR SETTING/GETTING STATUS VALUES from REPEATING SECTIONS
    on("change:repeating_statuses:statuscheck", function(eventInfo) {
       getAttrs(["repeating_statuses_status","repeating_statuses_statusdtype","repeating_statuses_statuscheck"],function(v) {
           let check = parseInt(v.repeating_statuses_statuscheck)||0;
            if(check === 1) {
                let quality = v.repeating_statuses_status;
                let value = v.repeating_statuses_statusdtype;
                setAttrs({
                    "status_chosen": quality,
                    "status_value": value,
          		    "repeating_statuses_statuscheck":0
    	        });
            }
       });
    });

    // CODE FOR HEALTH RANGES from TOTAL HP
    on('change:health_max sheet:opened', function() {
        getAttrs(['health_max'], function(values) {
            var indexg = parseInt(values.health_max);
            var indexy = Math.round((indexg+2)*0.7);
            var indexr = Math.round((indexg+2)/3);
            if (indexg === 37) {
                var indexy = 28;
            } else if (indexg === 19) {
                var indexy = 14;
            }
            setAttrs({ 'greenmin': indexy+1, 'yellowmax': indexy, 'yellowmin': indexr+1, 'redmax': indexr });
        });
    });

    // Opens and Closes Source inputs
    on("clicked:source_toggle", () => {
        getAttrs(['sourcebook'], function(v) {
            const sourceflip = v["sourcebook"] !== "hide" ? "hide" : "show";
            const output = {};
            output["sourcebook"] = sourceflip;
            setAttrs(output);
        });
    });
    on("change:sheetTab change:sourcebook change:repeating_greenabilities change:repeating_yellowabilities change:repeating_redabilities change:repeating_minionforms", function() {
        getSectionIDs("repeating_greenabilities", greenarray => {
        getSectionIDs("repeating_yellowabilities", yellowarray => {
        getSectionIDs("repeating_redabilities", redarray => {
        getSectionIDs("repeating_minionforms", minionarray => {
        getSectionIDs("repeating_greentwists", greenarray2 => {
        getSectionIDs("repeating_yellowtwists", yellowarray2 => {
        getSectionIDs("repeating_redtwists", redarray2 => {
            getAttrs(['sourcebook','sheetTab'], function(v) {
                const tabset = v.sheetTab
                const sourceset = v.sourcebook
                const output = {};
                greenarray.forEach(id => output[`repeating_greenabilities_${id}_resourcebook`] = sourceset);
                greenarray.forEach(id => output[`repeating_greenabilities_${id}_resheetTab`] = tabset);
                yellowarray.forEach(id => output[`repeating_yellowabilities_${id}_resourcebook`] = sourceset);
                redarray.forEach(id => output[`repeating_redabilities_${id}_resourcebook`] = sourceset);
                minionarray.forEach(id => output[`repeating_minionforms_${id}_resourcebook`] = sourceset);
                greenarray2.forEach(id => output[`repeating_greentwists_${id}_resourcebook`] = sourceset);
                yellowarray2.forEach(id => output[`repeating_yellowtwists_${id}_resourcebook`] = sourceset);
                redarray2.forEach(id => output[`repeating_redtwists_${id}_resourcebook`] = sourceset);
                setAttrs(output);
            });
        });
        });
        });
        });
        });
        });
        });
    });

    // Hide & Show for 6 mode buttons
    on("clicked:g1direction_toggle", function() {getAttrs(["g1direction"], function(v) {
        setAttrs({"g1direction": v["g1direction"] !== "down" ? "down" : "right"});
    });});
    on("clicked:g2direction_toggle", function() {getAttrs(["g2direction"], function(v) {
        setAttrs({"g2direction": v["g2direction"] !== "down" ? "down" : "right"});
    });});
    on("clicked:g3direction_toggle", function() {getAttrs(["g3direction"], function(v) {
        setAttrs({"g3direction": v["g3direction"] !== "down" ? "down" : "right"});
    });});
    on("clicked:y1direction_toggle", function() {getAttrs(["y1direction"], function(v) {
        setAttrs({"y1direction": v["y1direction"] !== "down" ? "down" : "right"});
    });});
    on("clicked:y2direction_toggle", function() {getAttrs(["y2direction"], function(v) {
        setAttrs({"y2direction": v["y2direction"] !== "down" ? "down" : "right"});
    });});
    on("clicked:r1direction_toggle", function() {getAttrs(["r1direction"], function(v) {
        setAttrs({"r1direction": v["r1direction"] !== "down" ? "down" : "right"});
    });});

    // Cycle Icons on Abilities
    on("clicked:repeating_greenabilities:icon1cycle", () => {
        // Check the current value of the hidden attribute.
        getAttrs(["repeating_greenabilities_icon1"], (v) => {
            const iconValue = parseInt(v["repeating_greenabilities_icon1"]) || 0;
            // Increment the attribute value by 1, or cycle back to 0 if the incremented value is equal to 7.
            setAttrs({
                "repeating_greenabilities_icon1": (iconValue + 1) % 7
            });
        });
    });
    on("clicked:repeating_greenabilities:icon2cycle", () => {
        getAttrs(["repeating_greenabilities_icon2"], (v) => {
            const iconValue = parseInt(v["repeating_greenabilities_icon2"]) || 0;
            setAttrs({"repeating_greenabilities_icon2": (iconValue + 1) % 7
    });});});
    on("clicked:repeating_greenabilities:icon3cycle", () => {
        getAttrs(["repeating_greenabilities_icon3"], (v) => {
            const iconValue = parseInt(v["repeating_greenabilities_icon3"]) || 0;
            setAttrs({"repeating_greenabilities_icon3": (iconValue + 1) % 7
    });});});
    on("clicked:repeating_yellowabilities:icon1cycle", () => {
        getAttrs(["repeating_yellowabilities_icon1"], (v) => {
            const iconValue = parseInt(v["repeating_yellowabilities_icon1"]) || 0;
            setAttrs({"repeating_yellowabilities_icon1": (iconValue + 1) % 7
    });});});
    on("clicked:repeating_yellowabilities:icon2cycle", () => {
        getAttrs(["repeating_yellowabilities_icon2"], (v) => {
            const iconValue = parseInt(v["repeating_yellowabilities_icon2"]) || 0;
            setAttrs({"repeating_yellowabilities_icon2": (iconValue + 1) % 7
    });});});
    on("clicked:repeating_yellowabilities:icon3cycle", () => {
        getAttrs(["repeating_yellowabilities_icon3"], (v) => {
            const iconValue = parseInt(v["repeating_yellowabilities_icon3"]) || 0;
            setAttrs({"repeating_yellowabilities_icon3": (iconValue + 1) % 7
    });});});
    on("clicked:repeating_redabilities:icon1cycle", () => {
        getAttrs(["repeating_redabilities_icon1"], (v) => {
            const iconValue = parseInt(v["repeating_redabilities_icon1"]) || 0;
            setAttrs({"repeating_redabilities_icon1": (iconValue + 1) % 7
    });});});
    on("clicked:repeating_redabilities:icon2cycle", () => {
        getAttrs(["repeating_redabilities_icon2"], (v) => {
            const iconValue = parseInt(v["repeating_redabilities_icon2"]) || 0;
            setAttrs({"repeating_redabilities_icon2": (iconValue + 1) % 7
    });});});
    on("clicked:repeating_redabilities:icon3cycle", () => {
        getAttrs(["repeating_redabilities_icon3"], (v) => {
            const iconValue = parseInt(v["repeating_redabilities_icon3"]) || 0;
            setAttrs({"repeating_redabilities_icon3": (iconValue + 1) % 7
    });});});
    // Cycle Icons on Mode Abilities
    on("clicked:g2icon1_cycle", () => {
        getAttrs(["g2icon1"], (v) => {
            const iconValue = parseInt(v["g2icon1"]) || 0;
            setAttrs({"g2icon1": (iconValue + 1) % 7
    });});});
    on("clicked:g2icon2_cycle", () => {
        getAttrs(["g2icon2"], (v) => {
            const iconValue = parseInt(v["g2icon2"]) || 0;
            setAttrs({"g2icon2": (iconValue + 1) % 7
    });});});
    on("clicked:g2icon3_cycle", () => {
        getAttrs(["g2icon3"], (v) => {
            const iconValue = parseInt(v["g2icon3"]) || 0;
            setAttrs({"g2icon3": (iconValue + 1) % 7
    });});});
    on("clicked:g3icon1_cycle", () => {
        getAttrs(["g3icon1"], (v) => {
            const iconValue = parseInt(v["g3icon1"]) || 0;
            setAttrs({"g3icon1": (iconValue + 1) % 7
    });});});
    on("clicked:g3icon2_cycle", () => {
        getAttrs(["g3icon2"], (v) => {
            const iconValue = parseInt(v["g3icon2"]) || 0;
            setAttrs({"g3icon2": (iconValue + 1) % 7
    });});});
    on("clicked:g3icon3_cycle", () => {
        getAttrs(["g3icon3"], (v) => {
            const iconValue = parseInt(v["g3icon3"]) || 0;
            setAttrs({"g3icon3": (iconValue + 1) % 7
    });});});
    on("clicked:y1icon1_cycle", () => {
        getAttrs(["y1icon1"], (v) => {
            const iconValue = parseInt(v["y1icon1"]) || 0;
            setAttrs({"y1icon1": (iconValue + 1) % 7
    });});});
    on("clicked:y1icon2_cycle", () => {
        getAttrs(["y1icon2"], (v) => {
            const iconValue = parseInt(v["y1icon2"]) || 0;
            setAttrs({"y1icon2": (iconValue + 1) % 7
    });});});
    on("clicked:y1icon3_cycle", () => {
        getAttrs(["y1icon3"], (v) => {
            const iconValue = parseInt(v["y1icon3"]) || 0;
            setAttrs({"y1icon3": (iconValue + 1) % 7
    });});});
    on("clicked:y2icon1_cycle", () => {
        getAttrs(["y2icon1"], (v) => {
            const iconValue = parseInt(v["y2icon1"]) || 0;
            setAttrs({"y2icon1": (iconValue + 1) % 7
    });});});
    on("clicked:y2icon2_cycle", () => {
        getAttrs(["y2icon2"], (v) => {
            const iconValue = parseInt(v["y2icon2"]) || 0;
            setAttrs({"y2icon2": (iconValue + 1) % 7
    });});});
    on("clicked:y2icon3_cycle", () => {
        getAttrs(["y2icon3"], (v) => {
            const iconValue = parseInt(v["y2icon3"]) || 0;
            setAttrs({"y2icon3": (iconValue + 1) % 7
    });});});
    on("clicked:r1icon1_cycle", () => {
        getAttrs(["r1icon1"], (v) => {
            const iconValue = parseInt(v["r1icon1"]) || 0;
            setAttrs({"r1icon1": (iconValue + 1) % 7
    });});});
    on("clicked:r1icon2_cycle", () => {
        getAttrs(["r1icon2"], (v) => {
            const iconValue = parseInt(v["r1icon2"]) || 0;
            setAttrs({"r1icon2": (iconValue + 1) % 7
    });});});
    on("clicked:r1icon3_cycle", () => {
        getAttrs(["r1icon3"], (v) => {
            const iconValue = parseInt(v["r1icon3"]) || 0;
            setAttrs({"r1icon3": (iconValue + 1) % 7
    });});});

    //Scripts for updating old character sheets
    const versionator = version => {
        console.log("Version Checking.")
        switch (true) {
            case !version:
            case version < 1:
                update_to_v1();
                break;
            case version < 1.1:
                update_to_v1_1();
                break;
            case version < 2:
                // add another function here when you need it
                break;
            case version < 3:
                // ditto
                break;
            default:
                console.log(`Version Update complete. Version: ${version}.`);
        }
    };
    on('sheet:opened', () => {
        getAttrs(['version'], v => {
            versionator(parseFloat(v.version) || 0);
        });
    });

    function update_to_v1() {
        getSectionIDs("repeating_principles", principlesarray => {
        getSectionIDs("repeating_powers", powersarray => {
        getSectionIDs("repeating_qualities", qualitiesarray => {
            const fieldnames = [];
            principlesarray.forEach(id => {
                fieldnames.push(`repeating_principles_${id}_principlename1`);
                fieldnames.push(`repeating_principles_${id}_principledesc1`);
            });
            powersarray.forEach(id => {
                fieldnames.push(`repeating_powers_${id}_powerdtype`);
            });
            qualitiesarray.forEach(id => {
                fieldnames.push(`repeating_qualities_${id}_qualitydtype`);
            });
            fieldnames.push("greendtype");
            fieldnames.push("yellowdtype");
            fieldnames.push("reddtype");

            getAttrs(["version","heropoints","background","ft","in", ...fieldnames], function(v) {
                let output = {};
                output.version = 1; //comment this while testing.

                if (v["heropoints"]) {
                    output["plus1"] = v["heropoints"];
                }
                if (v["background"]) {
                    output["hair"] = v["background"];
                    output["background"] = "";
                }
                if (v["ft"] || v["in"]) {
                    output["height"] = (v["ft"] || 0) + "'" + (v["in"] || 0) + '"';
                }
                let principleincrement = 0;
                principlesarray.forEach(id => {
                     principleincrement++;
                     attribute_name = `repeating_principles_${id}_principlename1`;
                     attribute_value =  v[attribute_name];
                     if (attribute_value.substr(0,13) == "Principle of ") {
                         attribute_value = attribute_value.substr(13);
                     }
                     output[`principle_name${principleincrement}`] = attribute_value;
                     attribute_name = `repeating_principles_${id}_principledesc1`;
                     output[`principle_rp${principleincrement}`] = v[attribute_name];
                });
                fieldnames.forEach(id => {
                    let str = v[id];
                    let res = str.substr(0,1);
                    if (res == "1") {
                        output[id] = str.substr(1);
                    };
                });
                setAttrs(output,
                    {silent: true},
                    //versionator(1));
                    versionator(output.version));
            });
        });
        });
        });
    };

    function update_to_v1_1() {
        getAttrs(["version","greenmax","currenthp"], function(v) {
            let output = {};
            output.version = 1.1;
            output["health"] = currenthp;
            output["health_max"] = greenmax;
            setAttrs(output,
                {silent: true},
                versionator(output.version));
        });
    };
</script>