# Block #11

{% hint style="info" %}
**Tips:**

1. How to **hide** any element for **non-logged** in **users** or show it only for **logged in** users? [Learn more](https://rosea.gitbook.io/baztheme/more/show-hide-for-non-logged-in-users)
2. **Title modifications** - [Learn more](https://rosea.gitbook.io/baztheme/global-styles/headings-text-modifications)
   {% endhint %}

### Available options

* Turn on
* Show Block Separator (hr)
* Additional Class Name (only for developers)
* Intro Title
* Intro Content
* HTML Content
* Footer Content

![](https://2873786088-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FCsh2IXpGstOXBcIR0peN%2Fuploads%2FMP0YRkhhHFVGozLM3DUI%2Fsep.svg?alt=media\&token=c216c050-ce9c-453e-8960-154078e4e819)

### Preview

![](https://2873786088-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FCsh2IXpGstOXBcIR0peN%2Fuploads%2Fe9QxldH458JhD7Qcbnza%2Fblock11.png?alt=media\&token=33a7e542-333a-4647-80b2-6d63462365da)

![](https://2873786088-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FCsh2IXpGstOXBcIR0peN%2Fuploads%2FMP0YRkhhHFVGozLM3DUI%2Fsep.svg?alt=media\&token=c216c050-ce9c-453e-8960-154078e4e819)

### Code snippet

```html
<!-- Start item -->
<div class="wrapper-xxl row no-gutters">
    <!-- Col #1 -->
    <div class="col-lg-5 pr-lg-6 mr-lg-3 align-self-center">
        <div class="rui-card--blank">
            <div class="rui-rounded-icon mb-3">
                <svg width="32" height="32" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M4.75 10L12 5.75L19.2501 10L12 14.25L4.75 10Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
                    <path d="M12.5 10C12.5 10.2761 12.2761 10.5 12 10.5C11.7239 10.5 11.5 10.2761 11.5 10C11.5 9.72386 11.7239 9.5 12 9.5C12.2761 9.5 12.5 9.72386 12.5 10Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"></path>
                    <path d="M6.75 11.5V16.25C6.75 16.25 8 18.25 12 18.25C16 18.25 17.25 16.25 17.25 16.25V11.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
                </svg>
            </div>
            <h4 class="lead-3 mt-3">Get real-time insights on your performance.</h4>
            <p class="rui-card-text">Auto-generated reports: Get accurate insights on your performance with auto-generated reports that help create successful campaigns.</p>
            <ul class="rui-special-list rui-special-list--light">
                <li>Personal asset watchlists</li>
                <li>Curated market data feed</li>
                <li>20+ on-chain, social &amp; dev metrics</li>
                <li>Low-latency market signals and alerts</li>
                <li class="list-icon-x">Sansheets plugin with pre-made templates</li>
            </ul>
            <a href="https://rosea.io" class="rui-card-btn-link mt-2">Learn more about the Smart Keyboard</a>
        </div>
    </div>
    <!-- End Col #1 -->

    <!-- Col #2 -->
    <div class="col mt-sm-5 mt-lg-0 rui-img--rounded-fluid">
        <img src="https://demo.rosea.io/baz/1/pluginfile.php/1/theme_baz/bazsettingsimgs/0/windows-72LU8QlGs5E-unsplash.jpg" alt="pic" width="800" height="533">
    </div>
    <!-- End Col #2 -->
</div>
<!-- End item -->

<!-- Start item -->
<hr class="hr-small">

<div class="wrapper-xxl row no-gutters mt-5">

    <!-- Col #1 -->
    <div class="col mt-sm-5 mt-lg-0 rui-img--rounded-fluid">
        <img src="https://demo.rosea.io/baz/1/pluginfile.php/1/theme_baz/bazsettingsimgs/0/img.jpg" alt="pic" width="800" height="533">
    </div>
    <!-- End Col #1 -->

    <!-- Col #2 -->
    <div class="col-lg-5 pl-lg-6 ml-lg-3 align-self-center">
        <div class="rui-card--blank">
            <div class="rui-rounded-icon mb-3">
                <svg width="32" height="32" fill="none" viewBox="0 0 24 24">
                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19.25 5.75C19.25 5.19772 18.8023 4.75 18.25 4.75H14C12.8954 4.75 12 5.64543 12 6.75V19.25L12.8284 18.4216C13.5786 17.6714 14.596 17.25 15.6569 17.25H18.25C18.8023 17.25 19.25 16.8023 19.25 16.25V5.75Z"></path>
                    <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4.75 5.75C4.75 5.19772 5.19772 4.75 5.75 4.75H10C11.1046 4.75 12 5.64543 12 6.75V19.25L11.1716 18.4216C10.4214 17.6714 9.40401 17.25 8.34315 17.25H5.75C5.19772 17.25 4.75 16.8023 4.75 16.25V5.75Z"></path>
                </svg>
            </div>
            <h4 class="lead-3 mt-3">Get real-time insights on your performance.</h4>
            <p class="rui-card-text">Auto-generated reports: Get accurate insights on your performance with auto-generated reports that help create successful campaigns.</p>
            <ul class="rui-special-list rui-special-list--primary">
                <li>Personal asset watchlists</li>
                <li>Curated market data feed</li>
                <li>20+ on-chain, social &amp; dev metrics</li>
                <li>Low-latency market signals and alerts</li>
                <li class="list-icon-x">Sansheets plugin with pre-made templates</li>
            </ul>
            <a href="https://rosea.io" class="rui-card-btn-link mt-2">Learn more about the Smart Keyboard</a>
        </div>
    </div>
    <!-- End Col #2 -->

</div>
<!-- End item -->
```

{% content-ref url="how-to-add-more-item-to-blocks" %}
[how-to-add-more-item-to-blocks](https://rosea.gitbook.io/baztheme/theme-settings/front-page-blocks/how-to-add-more-item-to-blocks)
{% endcontent-ref %}