Source: dist/css/acc_boot.css, line
8662
6.8.1
Stylized Blockquote with Quote Icons
This component is a blockquote that has been designed with an emphasis on style. It starts and ends with iconic quotation marks, followed by the actual quote text and a citation. The design uses flexible box model to ensure that the text and the quote icons align correctly. It also applies shadows, borders, and background colors to make the blockquote visually distinct.
Caption: This component is a styled version of a blockquote, complete with quotation mark icons, background colors, and borders.
<blockquote class="flex flex_column flex_row:md relative z_11 m_4 m_5:md font_copy">
<div class="flex_shrink l_n3:md relative">
<i class="absolute font_7 font_10:md t_n4 t_3:md l_0 l_n5:md fas fa-quote-left fa-fw c_acc-2 z_1 text-shadow_black-1" aria-hidden="true"></i>
</div>
<div class="br_1 br_black-1 br_radius br_solid c_black flex_100 flex_auto font_1 font_2:md font_3:lg m-x_n4:md p-x_4 p-x_6:md p-y_5 p-y_5:md shadow_bevel-light z_2">
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit.
Numquam consequuntur delectus vero. Ratione fugit totam
ipsum aperiam modi! Quas facilis consequuntur totam quod
inventore atque magnam deleniti labore quae minus?</p>
<cite class="c_acc-n3 float_right font-size_down-2 font_accent font_bold font_ui m-r_4 m-t_n3"><i class="fa-user fas fa-solid p-r_3" aria-hidden="true"></i>Dr. Ainsley Conolly, FACC</cite>
</div>
<div class="flex_shrink r_n3:md relative">
<i class="absolute b_3:md c_acc-2 fa-fw fa-quote-right fas font_7 font_10:md r_n5:md r_3 b_n4 text-shadow_black-2 z_1" aria-hidden="true"></i>
</div>
</blockquote>