<!-- Matrix Add-ons Tile Widget -->
<div class="is-matrix bg-primary">
    <div class="is-flex is-flex-block mobile-auto cc-clearover">
        <div class="col-6">
            <img class="is-img mobile-medium rel-mobile-only" srcset="https://u.jimcdn.com/cms/o/s1aeecbbb2a5865b1/userlayout/img/matrix-banner01.jpg?t=1632655885" />
        </div>

        <div class="mobile-auto col-6 m-padding cc-box" style="padding:5%;">
            <div class="color-white" style="max-width:800px; margin:0 auto;">
                <h3>
                    Ultimate tile 1
                </h3>
                <br />

                <p>
                    Lorem ipsum dolor sit amet,sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, At vero eos et accusam et justo duo dolores et ea rebum. Lorem ipsum
                    dolor sit amet, no sea takimata sanctus est Lorem ipsum dolor sit amet. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. no sea takimata sanctus
                    est Lorem ipsum dolor sit amet. no sea takimata sanctus est Lorem ipsum dolor sit amet. sed diam voluptua.
                </p>
                <br />
                
                 <a class="hs-button ghost-white" href="https://www.zodiac-framework.com/" target="">Custom button</a>
            </div>
        </div>
    </div>
</div>

<!-- Matrix Add-ons Tile Widget -->
<div class="is-matrix bg-grey">
    <div class="is-flex is-flex-block mobile-auto cc-clearover">
        <div class="mobile-auto col-6 m-padding cc-box" style="padding:5%;">
            <div class="" style="max-width:800px; margin:0 auto;">
                <h3>
                    Ultimate Tile 2
                </h3>
                <br />

                <p>
                    Lorem ipsum dolor sit amet,sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, At vero eos et accusam et justo duo dolores et ea rebum. Lorem ipsum
                    dolor sit amet, no sea takimata sanctus est Lorem ipsum dolor sit amet. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. no sea takimata sanctus
                    est Lorem ipsum dolor sit amet. no sea takimata sanctus est Lorem ipsum dolor sit amet. sed diam voluptua.
                </p>
                <br />
                <!-- ************* default button ************* -->
                 <a class="hs-button" href="https://www.zodiac-framework.com/" target="">Custom button</a>
            </div>
        </div>

        <div class="col-6">
            <img class="is-img mobile-medium rel-mobile-only" srcset="https://u.jimcdn.com/cms/o/s1aeecbbb2a5865b1/userlayout/img/matrix-banner01.jpg?t=1632655885" />
        </div>
    </div>
</div>

<!-- Matrix Add-ons Tile Widget -->
<div class="is-matrix-block is-fullwidth bg-dark">
    <div class="is-flex is-flex-block h-100 mobile-auto cc-clearover">
        <div class="col-6">
            <img class="is-img mobile-medium rel-mobile-only" srcset="https://u.jimcdn.com/cms/o/s1aeecbbb2a5865b1/userlayout/img/matrix-banner01.jpg?t=1632655885" />
        </div>

        <div class="is--flex h-100 mobile-auto col-6 m-padding cc-box" style="padding:5%;">
            <div class="color-white" style="max-width:800px; margin:0 auto;">
                <h3>
                    Ultimate tile 3
                </h3>
                <br />

                <p>
                    Lorem ipsum dolor sit amet,sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, At vero eos et accusam et justo duo dolores et ea rebum. Lorem ipsum
                    dolor sit amet, no sea takimata sanctus est Lorem ipsum dolor sit amet. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. no sea takimata sanctus
                    est Lorem ipsum dolor sit amet. no sea takimata sanctus est Lorem ipsum dolor sit amet. sed diam voluptua.
                </p>
                <br />
                
                 <a class="hs-button ghost-white" href="https://www.zodiac-framework.com/" target="">Custom button</a>
            </div>
        </div>
    </div>
</div>

<!-- Matrix Add-ons Tile Widget -->
<div class="is-matrix-block is-fullwidth bg-grey">
    <div class="is-flex is-flex-block h-100 mobile-auto cc-clearover">
        <div class="h-100 is--flex mobile-auto col-6 m-padding cc-box" style="padding:5%;">
            <div class="" style="max-width:800px; margin:0 auto;">
                <h3>
                    Ultimate tile 4
                </h3>
                <br />

                <p>
                    Lorem ipsum dolor sit amet,sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, At vero eos et accusam et justo duo dolores et ea rebum. Lorem ipsum
                    dolor sit amet, no sea takimata sanctus est Lorem ipsum dolor sit amet. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. no sea takimata sanctus
                    est Lorem ipsum dolor sit amet. no sea takimata sanctus est Lorem ipsum dolor sit amet. sed diam voluptua.
                </p>
                <br />
                
                 <a class="hs-button" href="https://www.zodiac-framework.com/" target="">Custom button</a>
            </div>
        </div>

        <div class="col-6">
            <img class="is-img mobile-medium rel-mobile-only" srcset="https://u.jimcdn.com/cms/o/s1aeecbbb2a5865b1/userlayout/img/matrix-banner01.jpg?t=1632655885" />
        </div>
    </div>
</div>