Obligation List

No notes defined.

<div class="sds-obligationList sds-stackXl">
    <div>
        <div class="row row-sm align-items-center justify-content-between">
            <div class="col-12 col-sm-8">
                <h2 class="h2">Les obligations distribuées par Spuerkeess</h2>
            </div>
            <div class="col-12 col-sm-auto flex-shrink-0">
                <button type="button" class="sds-btn -btnSecondary -block" data-toggle="collapse" data-target="#obligationCollapse">

                    <span class="sds-btn__text">Filtres</span>

                    <span class="sds-icon sds-icon-chevrondown"></span>

                </button>
            </div>
        </div>
        <div class="sds-collapse collapse show fade" id="obligationCollapse">
            <div class="sds-collapse__insetBottomXl sds-collapse__insetTopXl">
                <div class="row">
                    <div class="col-12 col-lg-8">
                        <div class="form-group-xl">
                            <div class="row row-cols-md-3">
                                <div class="col-12 col-sm-6 col-lg-4">
                                    <fieldset class="sds-stackLg">
                                        <legend>
                                            <span class="sds-label -large -form -noBottomSpacing -formNoOffset">
                                                Marché

                                            </span>
                                        </legend>
                                        <ul class="list-unstyled sds-stackLg">
                                            <li>
                                                <div class="sds-radio custom-control custom-radio">
                                                    <input value="radio-value" type="radio" name="radio-name-ob-marche" class="sr-only custom-control-input " id="radio-ob-marche-1" checked><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                                    <label class="custom-control-label" for="radio-ob-marche-1">
                                                        Tous
                                                    </label>

                                                </div>
                                            </li>
                                            <li>
                                                <div class="sds-radio custom-control custom-radio">
                                                    <input value="radio-value" type="radio" name="radio-name-ob-marche" class="sr-only custom-control-input " id="radio-ob-marche-2"><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                                    <label class="custom-control-label" for="radio-ob-marche-2">
                                                        Primaire
                                                    </label>

                                                </div>
                                            </li>
                                            <li>
                                                <div class="sds-radio custom-control custom-radio">
                                                    <input value="radio-value" type="radio" name="radio-name-ob-marche" class="sr-only custom-control-input " id="radio-ob-marche-3"><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                                    <label class="custom-control-label" for="radio-ob-marche-3">
                                                        Secondaire
                                                    </label>

                                                </div>
                                            </li>
                                        </ul>
                                    </fieldset>
                                </div>
                                <div class="col-12 col-sm-6 col-lg-4">
                                    <fieldset class="sds-stackLg">
                                        <legend>
                                            <span class="sds-label -large -form -noBottomSpacing -formNoOffset">
                                                Devise

                                            </span>
                                        </legend>
                                        <ul class="list-unstyled sds-stackLg">
                                            <li>
                                                <div class="sds-checkbox custom-control custom-checkbox">
                                                    <input value="checkbox-value" type="checkbox" name="" class="sr-only custom-control-input " id="checkbox-ob-devise-1" checked><span class="sds-checkboxDot sds-checkbox__shape" aria-hidden="true"></span>
                                                    <label class="custom-control-label" for="checkbox-ob-devise-1"></label>

                                                    <div class="sds-checkbox__error invalid-feedback">Error message</div>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="sds-checkbox custom-control custom-checkbox">
                                                    <input value="checkbox-value" type="checkbox" name="" class="sr-only custom-control-input " id="checkbox-ob-devise-2" checked><span class="sds-checkboxDot sds-checkbox__shape" aria-hidden="true"></span>
                                                    <label class="custom-control-label" for="checkbox-ob-devise-2">$</label>

                                                    <div class="sds-checkbox__error invalid-feedback">Error message</div>
                                                </div>
                                            </li>
                                            <li>
                                                <div class="sds-checkbox custom-control custom-checkbox">
                                                    <input value="checkbox-value" type="checkbox" name="" class="sr-only custom-control-input " id="checkbox-ob-devise-3" checked><span class="sds-checkboxDot sds-checkbox__shape" aria-hidden="true"></span>
                                                    <label class="custom-control-label" for="checkbox-ob-devise-3">Autres</label>

                                                    <div class="sds-checkbox__error invalid-feedback">Error message</div>
                                                </div>
                                            </li>
                                        </ul>
                                    </fieldset>
                                </div>
                                <div class="col-12 col-sm-6 col-lg-4">
                                    <fieldset class="sds-stackLg">
                                        <legend>
                                            <span class="sds-label -large -form -noBottomSpacing -formNoOffset">
                                                Rendement à l'échéance

                                            </span>
                                        </legend>
                                        <ul class="list-unstyled sds-stackLg">
                                            <li>
                                                <div class="sds-radio custom-control custom-radio">
                                                    <input value="radio-value" type="radio" name="radio-name-ob-ech" class="sr-only custom-control-input " id="radio-name-ob-ech-tous" checked><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                                    <label class="custom-control-label" for="radio-name-ob-ech-tous">
                                                        Tous
                                                    </label>

                                                </div>
                                            </li>
                                            <li>
                                                <div class="sds-radio custom-control custom-radio">
                                                    <input value="radio-value" type="radio" name="radio-name-ob-ech" class="sr-only custom-control-input " id="radio-name-ob-ech-achat"><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                                    <label class="custom-control-label" for="radio-name-ob-ech-achat">
                                                        Achat
                                                    </label>

                                                </div>
                                            </li>
                                            <li>
                                                <div class="sds-radio custom-control custom-radio">
                                                    <input value="radio-value" type="radio" name="radio-name-ob-ech" class="sr-only custom-control-input " id="radio-name-ob-ech-vente"><span class="sds-radioDot  sds-radio__shape" aria-hidden="true"></span>
                                                    <label class="custom-control-label" for="radio-name-ob-ech-vente">
                                                        Vente
                                                    </label>

                                                </div>
                                            </li>
                                        </ul>
                                    </fieldset>
                                </div>
                            </div>
                        </div>
                        <div class="form-group-xl">
                            <div class="row">
                                <div class="col-12 col-lg-8">
                                    <fieldset class="sds-stackLg">
                                        <legend>
                                            <span class="sds-label -large -form -noBottomSpacing">
                                                Rendement à l’échéance de ... à ...

                                            </span>
                                        </legend>
                                        <ul class="list-unstyled row no-inline-gutter no-bottom-gutter">
                                            <li class="col-6">
                                                <label for="ob-select-ech-1" class="sds-label -form sr-only">
                                                    Titre select 1

                                                </label>
                                                <div class="sds-select">
                                                    <select id="ob-select-ech-1" class="sds-select form-control">

                                                        <option value="opt-0">Option 1</option>

                                                        <option value="opt-1">Option 2</option>

                                                        <option value="opt-2">Option 3</option>

                                                    </select>
                                                    <span class="sds-select__arrow sds-icon sds-icon-chevrondown" aria-hidden="true"></span>

                                                </div>

                                            </li>
                                            <li class="col-6">
                                                <label for="ob-select-ech-2" class="sds-label -form sr-only">
                                                    Titre select 2

                                                </label>
                                                <div class="sds-select">
                                                    <select id="ob-select-ech-2" class="sds-select form-control">

                                                        <option value="opt-0">Option 1</option>

                                                        <option value="opt-1">Option 2</option>

                                                        <option value="opt-2">Option 3</option>

                                                    </select>
                                                    <span class="sds-select__arrow sds-icon sds-icon-chevrondown" aria-hidden="true"></span>

                                                </div>

                                            </li>
                                        </ul>
                                    </fieldset>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-12 col-lg-4">
                        <div class="form-group-xl">
                            <label for="ob-select-sec-ec" class="sds-label -large -form -noBottomSpacing">
                                Secteur économique

                            </label>
                            <div class="sds-select">
                                <select id="ob-select-sec-ec" class="sds-select form-control">

                                    <option value="opt-0">Option 1</option>

                                    <option value="opt-1">Option 2</option>

                                    <option value="opt-2">Option 3</option>

                                </select>
                                <span class="sds-select__arrow sds-icon sds-icon-chevrondown" aria-hidden="true"></span>

                            </div>

                        </div>
                        <div class="form-group-xl">
                            <div class="row">
                                <div class="col-12 col-xl-6">
                                    <fieldset class="sds-stackLg">
                                        <legend>
                                            <span class="sds-label -large -form -noBottomSpacing">
                                                Echéance de ... à ...

                                            </span>
                                        </legend>
                                        <ul class="list-unstyled row no-inline-gutter no-bottom-gutter">
                                            <li class="col-6">
                                                <label for="ob-select-ech-sec-ec-1" class="sds-label -form sr-only">
                                                    Titre select 1

                                                </label>
                                                <div class="sds-select">
                                                    <select id="ob-select-ech-sec-ec-1" class="sds-select form-control">

                                                        <option value="opt-0">Option 1</option>

                                                        <option value="opt-1">Option 2</option>

                                                        <option value="opt-2">Option 3</option>

                                                    </select>
                                                    <span class="sds-select__arrow sds-icon sds-icon-chevrondown" aria-hidden="true"></span>

                                                </div>

                                            </li>
                                            <li class="col-6">
                                                <label for="ob-select-ech-sec-ec-2" class="sds-label -form sr-only">
                                                    Titre select 2

                                                </label>
                                                <div class="sds-select">
                                                    <select id="ob-select-ech-sec-ec-2" class="sds-select form-control">

                                                        <option value="opt-0">Option 1</option>

                                                        <option value="opt-1">Option 2</option>

                                                        <option value="opt-2">Option 3</option>

                                                    </select>
                                                    <span class="sds-select__arrow sds-icon sds-icon-chevrondown" aria-hidden="true"></span>

                                                </div>

                                            </li>
                                        </ul>
                                    </fieldset>
                                </div>
                                <div class="col-12 col-xl-6">
                                    <fieldset class="sds-stackLg">
                                        <legend>
                                            <span class="sds-label -large -form -noBottomSpacing">
                                                Coupon de ... à ...

                                            </span>
                                        </legend>
                                        <ul class="list-unstyled row no-inline-gutter no-bottom-gutter">
                                            <li class="col-6">
                                                <label for="ob-select-coupon-1" class="sds-label -form sr-only">
                                                    Titre select 1

                                                </label>
                                                <div class="sds-select">
                                                    <select id="ob-select-coupon-1" class="sds-select form-control">

                                                        <option value="opt-0">Option 1</option>

                                                        <option value="opt-1">Option 2</option>

                                                        <option value="opt-2">Option 3</option>

                                                    </select>
                                                    <span class="sds-select__arrow sds-icon sds-icon-chevrondown" aria-hidden="true"></span>

                                                </div>

                                            </li>
                                            <li class="col-6">
                                                <label for="ob-select-coupon-2" class="sds-label -form sr-only">
                                                    Titre select 2

                                                </label>
                                                <div class="sds-select">
                                                    <select id="ob-select-coupon-2" class="sds-select form-control">

                                                        <option value="opt-0">Option 1</option>

                                                        <option value="opt-1">Option 2</option>

                                                        <option value="opt-2">Option 3</option>

                                                    </select>
                                                    <span class="sds-select__arrow sds-icon sds-icon-chevrondown" aria-hidden="true"></span>

                                                </div>

                                            </li>
                                        </ul>
                                    </fieldset>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row align-items-stretch-immediate">
        <div class="col-12 col-lg-6">
            <div class="sds-obligationCard sds-box -insetLg sds-boxShadowInteraction">
                <div class="sds-stackXxl">
                    <div class="sds-staticStackXs">
                        <h3 class="h3">JPMorgan Chase & Co (USD)</h3>
                        <p>US46625HKC33</p>
                        <p>Banques et autres institutions de crédit</p>
                    </div>
                    <div class="sds-stackXxl sds-box__outOfBoundsMd">
                        <div class="sds-obligationCard__recapArea">
                            <div class="sds-obligationCard__recapAreaRow row row-xs align-items-stretch-immediate no-bottom-gutter">
                                <div class="col-12 col-md-6">
                                    <div class="sds-box -insetLg -elevated">
                                        <table class="sds-infoTable table -noBorder">
                                            <tbody>
                                                <tr>
                                                    <td>
                                                        <div class="sds-infoTable__cellContent">
                                                            <div class="sds-label">
                                                                A l'achat

                                                            </div>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div class="sds-infoTable__cellContent">
                                                            <div class="sds-textBodyLg">
                                                                <div class="sds-amount -amountXl">
                                                                    <span class="sds-amount__value">106,85</span>

                                                                    <span class="sds-amount__currency">%</span>

                                                                </div>
                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                                <div class="col-12 col-md-6">
                                    <div class="sds-box -insetLg -elevated">
                                        <table class="sds-infoTable table -noBorder">
                                            <tbody>
                                                <tr>
                                                    <td>
                                                        <div class="sds-infoTable__cellContent">
                                                            <div class="sds-label">
                                                                A la vente

                                                            </div>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div class="sds-infoTable__cellContent">
                                                            <div class="sds-textBodyLg">
                                                                <div class="sds-amount -amountXl">
                                                                    <span class="sds-amount__value">109,60</span>

                                                                    <span class="sds-amount__currency">%</span>

                                                                </div>
                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="sds-obligationCard__tableWrapper sds-box -insetLg">
                            <table class="sds-obligationCard__table sds-infoTable table -noBorder">
                                <tbody>
                                    <tr>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td class=>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Rendement à l'échéance achat (%)

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    0.97
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td class=>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Rendement à l'échéance vente (%)

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    0.87
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td class=>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Coupon

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    3.125
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td class=>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Marché

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    Secondaire
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Maturité

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    23.01.2025
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Nominal facial unitaire

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    2.000,00
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <a href="" class="sds-obligationCard__action">
                        <div class="sds-obligationCard__actionInner">
                            <span class="sds-btn -btnPrimary position-static stretched-link">

                                <span class="sds-btn__text">Acheter sur S-Net</span>

                            </span>
                        </div>
                    </a>
                </div>
            </div>
        </div>
        <div class="col-12 col-lg-6">
            <div class="sds-obligationCard sds-box -insetLg sds-boxShadowInteraction">
                <div class="sds-stackXxl">
                    <div class="sds-staticStackXs">
                        <h3 class="h3">JPMorgan Chase & Co (USD)</h3>
                        <p>US46625HKC33</p>
                        <p>Banques et autres institutions de crédit</p>
                    </div>
                    <div class="sds-stackXxl sds-box__outOfBoundsMd">
                        <div class="sds-obligationCard__recapArea">
                            <div class="sds-obligationCard__recapAreaRow row row-xs align-items-stretch-immediate no-bottom-gutter">
                                <div class="col-12 col-md-6">
                                    <div class="sds-box -insetLg -elevated">
                                        <table class="sds-infoTable table -noBorder">
                                            <tbody>
                                                <tr>
                                                    <td>
                                                        <div class="sds-infoTable__cellContent">
                                                            <div class="sds-label">
                                                                A l'achat

                                                            </div>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div class="sds-infoTable__cellContent">
                                                            <div class="sds-textBodyLg">
                                                                <div class="sds-amount -amountXl">
                                                                    <span class="sds-amount__value">106,85</span>

                                                                    <span class="sds-amount__currency">%</span>

                                                                </div>
                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                                <div class="col-12 col-md-6">
                                    <div class="sds-box -insetLg -elevated">
                                        <table class="sds-infoTable table -noBorder">
                                            <tbody>
                                                <tr>
                                                    <td>
                                                        <div class="sds-infoTable__cellContent">
                                                            <div class="sds-label">
                                                                A la vente

                                                            </div>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div class="sds-infoTable__cellContent">
                                                            <div class="sds-textBodyLg">
                                                                <div class="sds-amount -amountXl">
                                                                    <span class="sds-amount__value">109,60</span>

                                                                    <span class="sds-amount__currency">%</span>

                                                                </div>
                                                            </div>
                                                        </div>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="sds-obligationCard__tableWrapper sds-box -insetLg">
                            <table class="sds-obligationCard__table sds-infoTable table -noBorder">
                                <tbody>
                                    <tr>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td class=>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Rendement à l'échéance achat (%)

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    0.97
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td class=>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Rendement à l'échéance vente (%)

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    0.87
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td class=>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Coupon

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    3.125
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td class=>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Marché

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    Secondaire
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Maturité

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    23.01.2025
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                        <td>
                                            <table>
                                                <tbody>
                                                    <tr>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-label">
                                                                    Nominal facial unitaire

                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td>
                                                            <div class="sds-infoTable__cellContent">
                                                                <div class="sds-textBodyLg">
                                                                    2.000,00
                                                                </div>
                                                            </div>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <a href="" class="sds-obligationCard__action">
                        <div class="sds-obligationCard__actionInner">
                            <span class="sds-btn -btnPrimary position-static stretched-link">

                                <span class="sds-btn__text">Acheter sur S-Net</span>

                            </span>
                        </div>
                    </a>
                </div>
            </div>
        </div>
        <div class="col-12 col-lg-6">
            <div class="sds-obligationCard sds-box -insetLg sds-boxShadowInteraction">
                <div class="sds-stackXxl">
                    <div class="sds-staticStackXs">
                        <span class="sds-skeletonUnit -h2"></span>
                        <span class="sds-skeletonUnit -h3 w-25"></span>
                        <span class="sds-skeletonUnit -h3 w-50"></span>
                    </div>
                    <div class="sds-stackXxl sds-box__outOfBoundsMd">
                        <div class="sds-obligationCard__recapArea sds-contextLoadingBlock -floating">
                            <div class="sds-obligationCard__recapAreaRow row row-xs no-bottom-gutter">
                                <div class="col-12 col-md-6">
                                    <span class="sds-skeletonUnit" style=" height: var(--obligation-card-recap-zone-card-height);"></span>
                                </div>
                                <div class="col-12 col-md-6">
                                    <span class="sds-skeletonUnit" style=" height: var(--obligation-card-recap-zone-card-height);"></span>
                                </div>
                            </div>
                        </div>
                        <div class="sds-obligationCard__tableWrapper sds-box -insetLg">
                            <div class="sds-stackXl">
                                <span class="sds-skeletonUnit -h2"></span>
                                <span class="sds-skeletonUnit -h2"></span>
                                <span class="sds-skeletonUnit -h2"></span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-12 col-lg-6">
            <div class="sds-obligationCard sds-box -insetLg sds-boxShadowInteraction">
                <div class="sds-stackXxl">
                    <div class="sds-staticStackXs">
                        <span class="sds-skeletonUnit -h2"></span>
                        <span class="sds-skeletonUnit -h3 w-25"></span>
                        <span class="sds-skeletonUnit -h3 w-50"></span>
                    </div>
                    <div class="sds-stackXxl sds-box__outOfBoundsMd">
                        <div class="sds-obligationCard__recapArea sds-contextLoadingBlock -floating">
                            <div class="sds-obligationCard__recapAreaRow row row-xs no-bottom-gutter">
                                <div class="col-12 col-md-6">
                                    <span class="sds-skeletonUnit" style=" height: var(--obligation-card-recap-zone-card-height);"></span>
                                </div>
                                <div class="col-12 col-md-6">
                                    <span class="sds-skeletonUnit" style=" height: var(--obligation-card-recap-zone-card-height);"></span>
                                </div>
                            </div>
                        </div>
                        <div class="sds-obligationCard__tableWrapper sds-box -insetLg">
                            <div class="sds-stackXl">
                                <span class="sds-skeletonUnit -h2"></span>
                                <span class="sds-skeletonUnit -h2"></span>
                                <span class="sds-skeletonUnit -h2"></span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <p class="sds-formDisclaimer">
        L'information diffusée sur ce site ne constitue pas une offre de vente et ne saurait donc pas à ce titre engendrer des obligations juridiques vis-à-vis des utilisateurs dans le chef de Spuerkeess.
    </p>
</div>
<div class="{{ namespace }}obligationList {{ namespace }}stackXl{% for mod in modifiers %} {{ mod }}{% endfor %}{% for mod in classes %} {{ mod }}{% endfor %}">
	<div>
		<div class="row row-sm align-items-center justify-content-between">
			<div class="col-12 col-sm-8">
				<h2 class="h2">Les obligations distribuées par Spuerkeess</h2>
			</div>
			<div class="col-12 col-sm-auto flex-shrink-0">
				{% render "@btn-secondary--icon-right",{
					icon: "icon-chevrondown",
					text: "Filtres",
					classes: ["-block"],
					attrs: {
						"data-toggle": "collapse",
						"data-target": "#obligationCollapse"
					}
				},true %}
			</div>
		</div>
		<div class="{{ namespace }}collapse collapse show fade" id="obligationCollapse">
			<div class="{{ namespace }}collapse__insetBottomXl {{ namespace }}collapse__insetTopXl">
				<div class="row">
					<div class="col-12 col-lg-8">
						<div class="form-group-xl">
							<div class="row row-cols-md-3">
								<div class="col-12 col-sm-6 col-lg-4">
									<fieldset class="{{ namespace }}stackLg">
										<legend>
											{% render '@label--form-large',{
												classes: ["-noBottomSpacing","-formNoOffset"],
												eltType: "span",
												text: "Marché"
											}, true %}
										</legend>
										<ul class="list-unstyled {{ namespace }}stackLg">
											<li>
												{% render '@radio--checked',{
													text: "Tous",
													id: "radio-ob-marche-1",
													inputName: "radio-name-ob-marche"
												}, true %}
											</li>
											<li>
												{% render '@radio',{
													text: "Primaire",
													id: "radio-ob-marche-2",
													inputName: "radio-name-ob-marche"
												}, true %}
											</li>
											<li>
												{% render '@radio',{
													text: "Secondaire",
													id: "radio-ob-marche-3",
													inputName: "radio-name-ob-marche"
												}, true %}
											</li>
										</ul>
									</fieldset>
								</div>
								<div class="col-12 col-sm-6 col-lg-4">
									<fieldset class="{{ namespace }}stackLg">
										<legend>
											{% render '@label--form-large',{
												classes: ["-noBottomSpacing","-formNoOffset"],
												eltType: "span",
												text: "Devise"
											}, true %}
										</legend>
										<ul class="list-unstyled {{ namespace }}stackLg">
											<li>
												{% render '@checkbox--checked',{
													text: "€",
													id: "checkbox-ob-devise-1"
												}, true %}
											</li>
											<li>
												{% render '@checkbox--checked',{
													text: "$",
													id: "checkbox-ob-devise-2"
												}, true %}
											</li>
											<li>
												{% render '@checkbox--checked',{
													text: "Autres",
													id: "checkbox-ob-devise-3"
												}, true %}
											</li>
										</ul>
									</fieldset>
								</div>
								<div class="col-12 col-sm-6 col-lg-4">
									<fieldset class="{{ namespace }}stackLg">
										<legend>
											{% render '@label--form-large',{
												classes: ["-noBottomSpacing", "-formNoOffset"],
												eltType: "span",
												text: "Rendement à l'échéance"
											}, true %}
										</legend>
										<ul class="list-unstyled {{ namespace }}stackLg">
											<li>
												{% render '@radio--checked',{
													text: "Tous",
													id: "radio-name-ob-ech-tous",
													inputName: "radio-name-ob-ech"
												}, true %}
											</li>
											<li>
												{% render '@radio',{
													text: "Achat",
													id: "radio-name-ob-ech-achat",
													inputName: "radio-name-ob-ech"
												}, true %}
											</li>
											<li>
												{% render '@radio',{
													text: "Vente",
													id: "radio-name-ob-ech-vente",
													inputName: "radio-name-ob-ech"
												}, true %}
											</li>
										</ul>
									</fieldset>
								</div>
							</div>
						</div>
						<div class="form-group-xl">
							<div class="row">
								<div class="col-12 col-lg-8">
									<fieldset class="{{ namespace }}stackLg">
										<legend>
											{% render '@label--form-large',{
												classes: ["-noBottomSpacing"],
												eltType: "span",
												text: "Rendement à l’échéance de ... à ..."
											}, true %}
										</legend>
										<ul class="list-unstyled row no-inline-gutter no-bottom-gutter">
											<li class="col-6">
												{% render "@label--form",{
													text: "Titre select 1",
													labelFor: "ob-select-ech-1",
													classes: ["sr-only"]
												},true %}
												{% render "@select",{
													id: "ob-select-ech-1"
												},true %}
											</li>
											<li class="col-6">
												{% render "@label--form",{
													text: "Titre select 2",
													labelFor: "ob-select-ech-2",
													classes: ["sr-only"]
												},true %}
												{% render "@select",{
													id: "ob-select-ech-2"
												},true %}
											</li>
										</ul>
									</fieldset>
								</div>
							</div>
						</div>
					</div>
					<div class="col-12 col-lg-4">
						<div class="form-group-xl">
							{% render "@label--form-large",{
								text: "Secteur économique",
								labelFor: "ob-select-sec-ec",
								classes: ["-noBottomSpacing"]
							},true %}
							{% render "@select",{
								id: "ob-select-sec-ec"
							},true %}
						</div>
						<div class="form-group-xl">
							<div class="row">
								<div class="col-12 col-xl-6">
									<fieldset class="{{ namespace }}stackLg">
										<legend>
											{% render '@label--form-large',{
												classes: ["-noBottomSpacing"],
												eltType: "span",
												text: "Echéance de ... à ..."
											}, true %}
										</legend>
										<ul class="list-unstyled row no-inline-gutter no-bottom-gutter">
											<li class="col-6">
												{% render "@label--form",{
													text: "Titre select 1",
													labelFor: "ob-select-ech-sec-ec-1",
													classes: ["sr-only"]
												},true %}
												{% render "@select",{
													id: "ob-select-ech-sec-ec-1"
												},true %}
											</li>
											<li class="col-6">
												{% render "@label--form",{
													text: "Titre select 2",
													labelFor: "ob-select-ech-sec-ec-2",
													classes: ["sr-only"]
												},true %}
												{% render "@select",{
													id: "ob-select-ech-sec-ec-2"
												},true %}
											</li>
										</ul>
									</fieldset>
								</div>
								<div class="col-12 col-xl-6">
									<fieldset class="{{ namespace }}stackLg">
										<legend>
											{% render '@label--form-large',{
												classes: ["-noBottomSpacing"],
												eltType: "span",
												text: "Coupon de ... à ..."
											}, true %}
										</legend>
										<ul class="list-unstyled row no-inline-gutter no-bottom-gutter">
											<li class="col-6">
												{% render "@label--form",{
													text: "Titre select 1",
													labelFor: "ob-select-coupon-1",
													classes: ["sr-only"]
												},true %}
												{% render "@select",{
													id: "ob-select-coupon-1"
												},true %}
											</li>
											<li class="col-6">
												{% render "@label--form",{
													text: "Titre select 2",
													labelFor: "ob-select-coupon-2",
													classes: ["sr-only"]
												},true %}
												{% render "@select",{
													id: "ob-select-coupon-2"
												},true %}
											</li>
										</ul>
									</fieldset>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="row align-items-stretch-immediate">
		<div class="col-12 col-lg-6">
			{% render "@spk-obligation-card" %}
		</div>
		<div class="col-12 col-lg-6">
			{% render "@spk-obligation-card" %}
		</div>
		<div class="col-12 col-lg-6">
			{% render "@spk-obligation-card--loading" %}
		</div>
		<div class="col-12 col-lg-6">
			{% render "@spk-obligation-card--loading" %}
		</div>
	</div>
	{% render "@form-disclaimer",{
		text: "L'information diffusée sur ce site ne constitue pas une offre de vente et ne saurait donc pas à ce titre engendrer des obligations juridiques vis-à-vis des utilisateurs dans le chef de Spuerkeess."
	},true %}
</div>