Arches: ACC & Bootstrap

Arches:ACC & Bootstrap

Multi Product Brand Style System by the American College of Cardiology

Source: dist/css/acc_boot.css, line 10209

5.4.2.3 Follow Up CTA – Page Divider

Incorporates a horizontal divider to create a subtle transition between content blocks, maintaining visual flow while signaling the importance of the CTA.

Example

Default styling

Commodi dolores (30 Characters) Rerum libg dero pariatur (40 Characters)

NOTE:
The CTA Description is optional
<div label="CTA_follow_up" class="reading-typography font-size_up p_4 p_5:md p_4 p-y_5:md p-y_6:lg "
  style="--custom-font-size-up: 1;">
  <div data-item="cta"
    class="p_4 p-t_6 p-x_5:lg bg_white br-t_1 br_solid br_primary-1 font-size_up m-t_6:lg m-y_4 m-y_5:md m_auto max-w_60 relative text_center relative">
    <h2 data-item="cta-title" class="m-b_3 lh_1 font_medium font_display">
        <strong class="font-size_up m-b_2 block">
        Commodi dolores (30&nbsp;Characters)        </strong>
        <small class="font-size_down block">
        Rerum libg dero pariatur (40&nbsp;Characters)        </small>
    </h2>
    <div class="grid justify_center">
        <button class="btn capitalize wrap wrap_balanced btn-primary expanded-click-area btn-lg">btn-primary expanded-click-area</button>    </div>
  </div>
</div>
Copy Code