<div class="pullLeft" style="display: flex; width: 320px;">
    <div class="pullLeft area-box">
        <div class="bioInformationArea floating-label-group">
            {{#if locked}}
                <input class="sheet-infoValues" type="text" value="{{localize data.system.breed}}" autocomplete="off" autofocus required />
            {{else}}
                <select class="sheet-infoValues editable" name="system.breed" data-name="data.system.breed" data-dtype="String">
                    {{selectOptions listData.BreedList selected=data.system.breed localize=false}}
                </select>
            {{/if}}
            <span class="floating-label">{{localize "wod.bio.breed"}}</span>
        </div>
        <div class="bioInformationArea floating-label-group">
            {{#if locked}}
                <input class="sheet-infoValues" type="text" value="{{localize data.system.auspice}}" autocomplete="off" autofocus required />
            {{else}}
                <select class="sheet-infoValues editable" name="system.auspice" data-name="data.system.auspice" data-dtype="String">
                    {{selectOptions listData.AuspiceList selected=data.system.auspice localize=false}}
                </select>
            {{/if}}
            <span class="floating-label">{{localize "wod.bio.aspect"}}</span>
        </div>    
    </div>
</div>