sure thing. <input type="radio" name="attr_tab" value="1" title="Character Sheet" checked="checked" /> <input type="radio" name="attr_tab" value="2" title="Warbird Sheet" /> <input type="radio" name="attr_tab" value="3" title="Map of Azure" /> <input type="radio" name="attr_tab" value="4" title="Fourth Tab" /> <input type="radio" name="attr_tab" value="5" title="Fifth Tab" /> <div> <h1>Character Sheet</h1> <div class='sheet-2colrow'> <!--Character info--> <div class='sheet-col'> <label>Character Name:</label><input type="text" name="attr_character_name"/> <label>Callsign:</label><input type="text" name="attr_callsign"/> <label>Player Name:</label><input type="text" name="attr_player_name"/> <label>Nationality:</label><input type="text" name="attr_nationality"/> <label>Squadron:</label><input type="text" name="attr_squadron"/> <label>Backround:</label><input type="text" name="attr_backround"/> <label>Appearance & Mannearisms:</label><textarea name="attr_appearance_mannearisms"></textarea> <!--health track--> <div> <h5>Health Track=Body+Spirit+3</h5> <table border="1px"> <tr> <td><input type="checkbox" name="attr_0"></td> <td><input type="checkbox" name="attr_-1a"></td> <td><input type="checkbox" name="attr_-1b"></td> <td><input type="checkbox" name="attr_-2a"></td> <td><input type="checkbox" name="attr_-2b"></td> <td><input type="checkbox" name="attr_-3a"></td> <td><input type="checkbox" name="attr_-3b"></td> <td><input type="checkbox" name="attr_-3c"></td> <td><input type="checkbox" name="attr_-3d"></td> <td><input type="checkbox" name="attr_-3e"></td> </tr> <tr> <td>0</td> <td>-1</td> <td>-1</td> <td>-2</td> <td>-2</td> <td>-3</td> <td>-3</td> <td>-3</td> <td>-3</td> <td>-3</td> </tr> <tr> <td><input type="checkbox" name="attr_0"/></td> <td><input type="checkbox" name="attr_-1aa"/></td> <td><input type="checkbox" name="attr_-1ab"/></td> <td><input type="checkbox" name="attr_-2aa"/></td> <td><input type="checkbox" name="attr_-2ab"/></td> <td><input type="checkbox" name="attr_-3aa"/></td> <td><input type="checkbox" name="attr_-3ab"/></td> <td><input type="checkbox" name="attr_-3ac"/></td> <td><input type="checkbox" name="attr_-3ad"/></td> <td><input type="checkbox" name="attr_-3ae"/></td> </tr> </table> </div> <!--Skills--> <h3>Skills</h3> <fieldset> <table border="1px"> <thead> <tr> <th>Knack</th> <th>Skills</th> <th>Level</th> <th>Stat</th> <th>XP</th> </tr> </thead> <tbody> <td><input type="checkbox"/></td> <td><input type="text" name="attr_skill_name"/></td> <td><input type="number" name="attr_skill_level"/></td> <td> <select style="width: 61px"> <option>Body</option> <option>Mind</option> <option>Spirit</option> </select> </td> <td><input type="number" name"attr_xp_level"/></td> </tbody> </table> </fieldset> </div> <!--Start of Column 2--> <div class='sheet-col'> <!--Primary Stats--> <h3>Stats</h3> <div class='sheet-2colrow'> <div class='sheet-col'> <label>Body:</label><input type="number" name="attr_body"/> <label>Mind:</label><input type="number" name="attr_mind"/> <label>Spirit:</label><input type="number" name="attr_spirit"/> <label>Stat Points:</label><input type="number" name="attr_stat_points"/> </div> <div class='sheet-col'> <label>Fame:</label><input type="number" name="attr_fame"/> <label>Fame Points:</label><input Type="number" name="attr_fame_points"/> <label>Reserve:</label><input Type="number" name="attr_reserve"/> </div> </div> <!--Secondary Stats--> <div> <h3 align="centert">Secondary Stats</h3> <label>Defance:</label><input Type="number" name="attr_defence"/> <label>Resist:</label><input Type="number" name="attr_resist"/> <label>Health:</label><input Type="number" name="attr_health"/> </div> <div> <!--Weapons table--> <h3>Persinal Weapon</h3> <fieldset> <table border="1px"> <thead> <th>Weapon</th> <th>Stat</th> <th>Skill lvl</th> <th>Other Mods</th> <th>Damage</th> </thead> <tbody> <td><input type="text" name="attr_weapon_name"></td> <td> <select style="width: 61px" name="attr_base_stats"> <option value="@{body}">Body</option> <option value="@{mind}">Mind</option> <option value="@{spirit}">Spirit</option> </select> </td> <td><input type="number" name="attr_weapon_skill"/></td> <td><input type="number" name="attr_attack_mods"/></td> <td><input type="number" name="attr_persinal_damage"/></td> </tbody> </table> <button type='roll' value='/roll 1d6 @{base_stats} + @{weapon_skill} + @{attack_mods} + @{persinal_damage}'/> </fieldset> </div> <div> <h3>Advantages & Dasadvantages</h3> <fieldset> <table> <tr> <td><label>Advantage:</label><input type"text" name="attr_advantage"/></td> <td><label>Disadvantage:</label><input type"text" name="attr_disadvantage"/></td> </tr> </table> </fieldset> </div> </div> </div> </div> <div> <h1>Tab the Second</h1> consectetur adipisicing elit </div> <div> <h1>3rd Tab</h1> sed do eiusmod tempor incididunt ut labore et dolore magna aliqua </div> <div> <h1>Fourth Tab</h1> Ut enim ad minim veniam </div> <div> <h1>Fifth Tab</h1> lz rhkpAWE"h mpwe4a </div> div.sheet-tab-content { display: none; } input.sheet-tab1:checked ~ div.sheet-tab1, input.sheet-tab2:checked ~ div.sheet-tab2, input.sheet-tab3:checked ~ div.sheet-tab3, input.sheet-tab4:checked ~ div.sheet-tab4, input.sheet-tab5:checked ~ div.sheet-tab5, input.sheet-tab6:checked ~ div.sheet-tab6 { display: block; } input.sheet-tab { width: 150px; height: 20px; position: relative; top: 5px; left: 6px; margin: -1.5px; cursor: pointer; z-index: 1; } input.sheet-tab::before { content: attr(title); border: solid 1px #a8a8a8; border-bottom-color: black; text-align: center; display: inline-block; background: #fff; background: -moz-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8); background: -webkit-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8); background: -ms-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8); background: -o-linear-gradient(to top, #c8c8c8, #fff, #c8c8c8); background: linear-gradient(to top, #c8c8c8, #fff, #c8c8c8); width: 150px; height: 20px; font-size: 18px; } input.sheet-tab:checked::before { background: #dcdcdc; background: -moz-linear-gradient(to top, #fcfcfc, #dcdcdc, #fcfcfc); background: -webkit-linear-gradient(to top, #fcfcfc, #dcdcdc, #fcfcfc); background: -ms-linear-gradient(to top, #fcfcfc, #dcdcdc, #fcfcfc); background: -o-linear-gradient(to top, #fcfcfc, #dcdcdc, #fcfcfc); background: linear-gradient(to top, #fcfcfc, #dcdcdc, #fcfcfc); border-bottom-color: #fff; } input.sheet-tab:not(:first-child)::before { border-left: none; } input.sheet-tab2::before { background: #fee; background: -moz-linear-gradient(to top, #f8c8c8, #fee, #f8c8c8); background: -webkit-linear-gradient(to top, #f8c8c8, #fee, #f8c8c8); background: -ms-linear-gradient(to top, #f8c8c8, #fee, #f8c8c8); background: -o-linear-gradient(to top, #f8c8c8, #fee, #f8c8c8); background: linear-gradient(to top, #f8c8c8, #fee, #f8c8c8); } input.sheet-tab2:checked::before { background: #dcdcdc; background: -moz-linear-gradient(to top, #fcecec, #f8c8c8, #fcecec); background: -webkit-linear-gradient(to top, #fcecec, #f8c8c8, #fcecec); background: -ms-linear-gradient(to top, #fcecec, #f8c8c8, #fcecec); background: -o-linear-gradient(to top, #fcecec, #f8c8c8, #fcecec); background: linear-gradient(to top, #fcecec, #f8c8c8, #fcecec); border-bottom-color: #fcecec; } div.sheet-tab-content { border: 1px solid #a8a8a8; border-top-color: #000; margin: 2px 0 0 5px; padding: 5px; } div.sheet-tab2 { background-color: #fcecec; }