<form class="form">
    <fieldset class="fieldset">
        <div class="fieldset__heading">
            <h2 class="fieldset__headline">Form Heading</h2>
            <div class="fieldset__note">Form Note. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
        </div>
        <div class="fieldset__fields">
            <div class="form-field">
                <label class="label" for="field-1">Label</label>
                <input type="text" class="input-text" name="field-1" id="field-1">
            </div>
            <div class="form-field">
                <label class="label label--inline" for="field-2">Another label</label>
                <span class="form-note">(optional)</span>
                <input type="text" class="input-text" name="field-2" id="field-2">
                <div class="form-note">Lorem ipsum dolor sit amet</div>
            </div>
            <div class="form-field form-field--error">
                <label class="label" for="field-3">Error field</label>
                <input type="text" class="input-text" name="field-3" id="field-3">
                <p class="form-field__error-message">This field has an error</p>
            </div>
            <div class="form-field">
                <label class="label" for="option-one">
                    <input type="radio" class="pseudo-radio-input" name="field-4" id="option-one" value="option-one" checked="checked">
                    <div class="pseudo-radio">
                        <div class="pseudo-radio__header">Option one</div>
                        <p class="pseudo-radio__note">Lorem ipsum dolor sit amet</p>
                    </div>
                </label>
                <label class="label" for="option-two">
                    <input type="radio" class="pseudo-radio-input" name="field-4" id="option-two" value="option-two">
                    <div class="pseudo-radio">
                        <div class="pseudo-radio__header">Option two</div>
                        <p class="pseudo-radio__note">Consectetur adipisicing elit</p>
                    </div>
                </label>
            </div>
            <div class="form-field">
                <div class="checkbox">
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit:
                    <label class="label">
                        <input type="checkbox">
                        Checkbox one
                    </label>
                    <label class="label">
                        <input type="checkbox">
                        Checkbox two
                    </label>
                </div>
            </div>
            <div class="form-field">
                <label class="label" for="field-5">Select label</label>
                <select class="select select--wide" id="field-5">
                    <option val="1">Lorem ipsum dolor sit amet</option>
                    <option val="2">Consectetur adipisicing elit</option>
                </select>
            </div>
        </div>
    </fieldset>
    <fieldset class="fieldset fieldset--simple">
        <div class="fieldset__heading"></div>
        <div class="fieldset__fields">
            <p class="form-note">By joining Guardian Membership, you are agreeing to our <a href="#">Terms and Conditions</a> and <a href="#">Privacy Policy</a>.</p>
            <div class="actions">
                <button type="submit" class="button button--primary button--large">Submit</button>
            </div>
        </div>
    </fieldset>
</form>