Arches: Virtual ACC

Arches:Virtual ACC

Multi Product Brand Style System by the American College of Cardiology

Source: dist/css/virtual_boot.css, line 13310

14.8.1.3 Athletic Heart CARD

deprecated

Care of the Athletic Heart Virtual

Deprecated: Old Designs from Virtual 2020

Example

Default styling

Care of the Athletic Heart Virtual

A focus on evidence-based, practical, cardiovascular care strategies for the elite athlete to exercise enthusiast.

live
June 20, 2020
on demand
Until December 31, 2020
available credits
  •   cme
  •   moc ii
<div id="AH20" class="conference_teaser br_shade br_1 br_solid m-b_4 p-x_4 br_radius relative c_white">
    <h1 class="conference_logo font_bold font_display m_0">
        <a class="expanded-click-area" href="/AH20"><span class="display_none">Care of the Athletic Heart Virtual</span></a>
    </h1>
    <p class="font_0 font_1:md   font_medium lh_2 p-x_2 text-shadow_black-1">A focus on evidence-based, practical, cardiovascular care strategies for the elite athlete to exercise enthusiast.</p>
    <div class="absolute:md b_3 flex flex_column flex_row:md font_n1 l_4 m-b_0:md m-b_n4 p-b_0:md p-b_3 r_4">
        <div class="">
            <div class="br-b_1 br_solid:md br_white-5 font_n2 m-b_2:md m-b_n2 text_left uppercase">live</div> <strong class="p-l_2:md">June 20, 2020</strong>
        </div>
        <div class="block m-l_4:md m-t_0:md m-t_3">
            <div class="br-b_1 br_solid:md br_white-5 font_n2 m-b_2:md m-b_n2 text_left uppercase">on demand</div> <strong class="p-l_2:md">Until December 31, 2020</strong>
        </div>
        <div class="m-l_auto:md m-t_3 m-t_0:md">
            <div class="br-b_1 br_solid br_white-5 font_n2 m-b_2 text_right:md text_left uppercase">available credits</div>
            <div class="flex_grow uppercase text_right:md font_bold">
                <ul class="m-t_n2 ul_none">
                    <li class="inline-block lh_0 p-l_3:md">
                        <span class="bg_CME br_1 br_white-3 br_circle br_solid inline-block m-r_1" style=" height: 1em; width: 1em;">&nbsp;</span> cme </li>
                    <li class="inline-block lh_0 p-l_3">
                        <span class="bg_MOCII br_1 br_white-3 br_circle br_solid inline-block m-r_1" style=" height: 1em; width: 1em;">&nbsp;</span> moc ii</li>
                </ul>
            </div>
        </div>
    </div>
</div>
<style>
#AH20 {
    padding-top: 38%;
    background-color: #002d5b;
    background-image: url(../img/virtual/lobby/AH20/logo.sm.png), url(../img/virtual/lobby/AH20/background.sm.png);
}
@media only screen and (min-width : 768px) {
#AH20 {
    padding-top: calc(127px + 1.5rem);
    background-image: url(../img/virtual/lobby/AH20/logo.lg.png), url(../img/virtual/lobby/AH20/secondaryLogo.lg.png), url(../img/virtual/lobby/AH20/img.lg.png), url(../img/virtual/lobby/AH20/background.lg.png);
    background-position: -3px 11px, calc(100% - 1rem) 1rem, top right, top center;
    };
}
</style>
Copy Code