<form class="editable" onsubmit="event.preventDefault();" style="background:var(--fco-sheet-background-colour); color:var(--fco-sheet-text-colour); padding:10px">
    <div id = "header">
    <div name = "stunt_body" style="overflow-y:auto; width:710px; height:auto; border:none"><!--Begin body-->
        <table style="background-color: transparent; border:none; width:690px">    
            <tr style="background-color:transparent">
                <td style="font-family:var(--fco-font-family)" width="120">{{localize 'fate-core-official.Name'}}:</td>
                <td colspan="2"><input style="background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour); font-family:var(--fco-font-family); border-left:none; border-right:none; border-top:none; border-bottom: 1px solid var(--fco-foundry-interactable-color); width:300px" name="name" id="{{stunt.name}}" value="{{stunt.name}}"</input></td>
            </tr>
            <tr style="background-color:transparent">
                <td style="font-family:var(--fco-font-family)">{{localize 'fate-core-official.LinkedSkill'}}:</td>                
                <td colspan ="2"><select style="background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour); font-family:var(--fco-font-family); border:1px solid var(--fco-foundry-interactable-color)" name="linked_skill"><option selected="selected" disabled="disabled">{{stunt.linked_skill}}</option><option>{{localize 'fate-core-official.None'}}</option><option>{{localize 'fate-core-official.Special'}}</option>{{#each skills}}<option>{{this.name}}</option>{{/each}}</select> 
                <i style="font-family:var(--fco-font-family); font-style:normal;">{{localize 'fate-core-official.Bonus'}}: </i><input name="bonus" type="number" defaultValue="0" min="0" max="10" value="{{stunt.bonus}}" style="background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour); border:solid 1px var(--fco-foundry-interactable-color); width:50px"></input></td>
            </tr>
            <tr style="background-color:transparent">
                <td style="font-family:var(--fco-font-family)">{{localize 'fate-core-official.Description'}}:</td>
                <td colspan="2">
                    <div id="edit_stunt_desc" data-edit="description" contenteditable="true" name="description" style="padding:5px; min-height:1.5em; display:none; background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour); font-family:var(--fco-font-family); border: 1px solid var(--fco-foundry-interactable-color); width:500px;">{{{stunt.description}}}</div>
                    <div id="edit_stunt_desc_rich" tabindex = "0" style="padding:5px; min-height: 1.5em; background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour); font-family:var(--fco-font-family); border: 1px solid var(--fco-foundry-interactable-color); width:500px;">{{{stunt.richDesc}}}</div>
                </td>
            </tr>
            <tr style="background-color:transparent">
                <td>{{localize 'fate-core-official.macro'}}:</td>
                <td>
                    <input type="string" name="macro" style="background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour); height:30px; width:300px; border:solid 1px var(--fco-foundry-interactable-color)" value="{{stunt.macro}}"</input> <span style = "padding-left:10px" id="{{stunt.name}}_macroName">{{macroName}}</span>
                </td>
            </tr>
            <tr style="background-color:transparent">
                <td style="font-family:var(--fco-font-family)">{{localize 'fate-core-official.RefreshCost'}}:</td>
                <td><input type="number" name="refresh_cost" style="background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour); height:30px; width:50px; border:solid 1px var(--fco-foundry-interactable-color)" value="{{stunt.refresh_cost}}"></input></td>
            </tr>
            <tr style="background-color:transparent">
                <td>{{localize 'fate-core-official.Boxes'}}:</td>
                <td>
                    <input type="number" name="boxes" min="0" style="background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour); height:30px; width:50px; border:solid 1px var(--fco-foundry-interactable-color)" value="{{stunt.boxes}}"></input>    
                </td>
            </tr>
            <tr style="background-color:transparent">
                <td>
                    {{localize 'fate-core-official.Actions'}}:
                </td>
                <td colspan="2">     
                    <input type="checkbox" name="overcome" {{checked stunt.overcome}}></input><b style="font-family:Fate Core; font-size:xx-large; padding-right:20px" title="{{localize 'fate-core-official.Overcome'}}">O</b>
                    <input type="checkbox" name="caa" {{checked stunt.caa}}><b style="font-family:Fate Core; font-size:xx-large; padding-right:20px" title="{{localize 'fate-core-official.CAA'}}">C</b></input>
                    <input type="checkbox" name="attack" {{checked stunt.attack}}></input><b style="font-family:Fate Core; font-size:xx-large; padding-right:20px" title="{{localize 'fate-core-official.Attack'}}">A</b>
                    <input type="checkbox" name="defend" {{checked stunt.defend}}></input><b style="font-family:Fate Core; font-size:xx-large; padding-right:20px" title="{{localize 'fate-core-official.Defend'}}">D</b>                   
                </td>
            </tr>
        </table>
    </div><!--End body-->
    <div id="buttons" style="width:400px">
        <button type="button" style="border:2px groove var(--fco-foundry-interactable-color); background-color:var(--fco-sheet-input-colour); color:var(--fco-sheet-text-colour); float:left; width:75px" id="save">{{localize 'fate-core-official.Save'}}</button>
    </div><!--End buttons div-->
    </div><!--End of header DIV-->
</form>
