Arches: ACC & Bootstrap

Arches:ACC & Bootstrap

Multi Product Brand Style System by the American College of Cardiology

Example

Default styling

Cardiovascular Team Section

Long-Term Cardiovascular Outcomes After Bariatric Surgery in the Medicare Population | Journal of the American College of Cardiology

The patient is an 80-year-old male with a history of diabetes mellitus type 2, end stage renal disease, chronic obstructive pulmonary disease (COPD), and lung cancer with recent radiation therapy. He is seen in the emergency department because of...

<article class="br_radius br_1 br_black-2 bg_black_-05 br_solid p_4 relative m-b_4 font_ui">
    <div class="flex flex_row:md flex_column gap-x_4">
        <div class="aspect_1x1 flex_none" style="width: clamp(75px, 10vw, 125px);">
        	<img src="https://picsum.photos/110/110" alt="" class="w_100">
        </div>        <div class="flex_auto m-r_4:md">
            <span class="journal-title c_accent-2 font_bold uppercase wrap block:md font_n1">Cardiovascular Team Section</span>
            <h2 class="article-title c_primary-n2 cursor_pointer font_1 font_3:md font_display font_medium  h:underline lh_1 m-y_2">Long-Term Cardiovascular Outcomes After Bariatric Surgery in the Medicare Population | Journal of the American College of Cardiology</h2>
            <div class="meta m-t_2:md m-l_3 m-l_0:md m-b_3 m-b_0:md font_bold">
                <span class="c_black-7 m-r_3">Apr 11, 2022</span>
                <a href="/">Julianne Fallon, PharmD</a><br>
            </div>
        </div>
    </div>
    <div class="flex flex_row:md flex_column gap-x_4 w_100">
        <div class="flex flex_column-reverse flex_row:md gap-x_4 flex-grow_1">
            <div class="article-content">
                <p class="excerpt font_copy font_0 lh_2 m-b_3 m-t_2 z_1">The patient is an 80-year-old male with a history of diabetes mellitus type 2, end stage renal disease, chronic obstructive pulmonary disease (COPD), and lung cancer with recent radiation therapy. He is seen in the emergency department because of...</p>
            </div>
        </div>
    </div>
</article>
Copy Code