This is for testing. If you have made it visible by setting hidden: false in the kitchen-sink.config.yml file, please don’t leave it that way when getting ready to merge your PR.
<div class="bg--black--pattern--brain container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--black--pattern--community container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--black--pattern--particle container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--black container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--gold--pattern--brain container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--gold--pattern--community container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--gold--pattern--particle container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--gold container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--gray--pattern--brain container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--gray--pattern--community container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--gray--pattern--particle container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--gray container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--white--pattern--brain container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--white--pattern--community container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--white--pattern--particle container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<div class="bg--white container--padded">
<a href="https://www.example.com" class="bttn bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--primary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--caps">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="" class="bttn bttn--outline bttn--tertiary bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<a href="https://www.example.com" class="bttn bttn--secondary bttn--sans-serif bttn--outline bttn--outline">
More News
</a>
<a href="" class="bttn bttn--link bttn--sans-serif">
More News
<i class="fas fa-arrow-right"></i>
</a>
<h2 class="headline ">
<span class="headline__text">Roboto</span>
</h2>
<h2 class="headline ">
<a href="https://uiowa.edu">
<span class="headline__text">Roboto</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio</span>
</a>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<span class="headline__text">Antonio - Underline</span>
</h2>
<h2 class="headline headline--underline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Underline</span>
</a>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<span class="headline__text">Antonio - Highlighted</span>
</h2>
<h2 class="headline headline--uppercase headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Highlighted</span>
</a>
</h2>
<h2 class="headline headline--uppercase">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</h2>
<h2 class="headline headline--uppercase">
<a href="https://uiowa.edu">
<span class="headline__text">Antonio - Single <span>Word</span> Highlighted</span>
</a>
</h2>
<h2 class="headline headline--serif">
<span class="headline__text">Zilla Slab (Serif)</span>
</h2>
<h2 class="headline headline--serif">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif)</span>
</a>
</h2>
<h2 class="headline headline--serif headline--underline">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</h2>
<h2 class="headline headline--serif headline--underline">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Underlined</span>
</a>
</h2>
<h2 class="headline headline--serif headline--highlight">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</h2>
<h2 class="headline headline--serif headline--highlight">
<a href="https://uiowa.edu">
<span class="headline__text">Zilla Slab (Serif) - Highlighted</span>
</a>
</h2>
<p>Iowa's <em>leadership</em> in both the <sub>arts and sciences</sub> fosters unique <u>resources</u>, like the <a href="https://uiowa.edu">College of Medicine's Arts and Humanities Program</a>, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote Text</p>
</blockquote>
<figcaption>Figcaption <a href="/">Link</a></figcaption>
<table>
<caption>This is a default table. <a href="#">Link</a>
<p><a href="#">Link</a></p>
</caption>
<thead>
<tr>
<th><a href="/">Person</a></th>
<th>Number</th>
<th>Third Column</th>
</tr>
</thead>
<tbody>
<tr>
<th>Someone Lastname</th>
<td>900</td>
<td>Nullam quis <a href="/">Link</a> risus eget urna mollis ornare vel eu leo.<p><a href="/">Link</a></p>
</td>
</tr>
<tr>
<th>
<a href="#">Person Name</a>
</th>
<td>1200</td>
<td>Vestibulum id ligula porta felis euismod semper. Donec ullamcorper
nulla non metus auctor fringilla.</td>
</tr>
<tr>
<th>Another Person</th>
<td>1500</td>
<td>Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor
auctor. Nullam id dolor id nibh ultricies vehicula ut id elit.</td>
</tr>
<tr>
<th>Last One</th>
<td>2800</td>
<td>Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Cras
mattis consectetur purus sit amet fermentum.</td>
</tr>
</tbody>
</table>
<div class="card__wrapper">
<div class="card click-container card--stacked bg--white card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature1.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Dedicated to having an impact on human health</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container card--enclosed card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature4.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Swinging for the fences in sports management</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gold card--stacked card--enclosed card__row">
<div class="card__media ">
<img class="" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/feature3.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" aria-describedby="desc-a-card" class="click-target">
<span class="headline__text">Turning the tide for sick seals</span>
</a>
</h2>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif" id="desc-a-card">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
/*margin: 1.25rem 3rem 10rem;*/
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
<div class="card__wrapper">
<div class="card click-container bg--white card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--black card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
<div class="card click-container bg--gray card--media-left card--enclosed card__row">
<div class="card__media media--circle card__media--small">
<img class="media--border media--circle" src="https://sandbox.prod.drupal.uiowa.edu/sites/sandbox.uiowa.edu/files/2021-03/events-01.jpg" alt="Alt Text">
</div>
<div class="card__body">
<h2 class="headline ">
<a href="https://uiowa.edu/" class="click-target">
<span class="headline__text">Getting to know Iowa's fall 2018 graduates</span>
</a>
</h2>
<div class="card__details">
<div class="card__subtitle">Card Subtitle</div>
<div class="card__meta">
June 14, 1984
</div>
<div class="card__meta">
<i class="fas fa-map-marker-alt"></i>
Carver-Hawkeye Arena
</div>
</div>
<p>Iowa's leader<em>ship in both t</em>he arts <sub>and scien</sub>ces fosters unique resou<u>rces, like the </u>Coll<a data-entity-substitution="canonical" data-entity-type="node" data-entity-uuid="59f8f236-7301-4dcb-afc6-3d535ae6fc6b" href="/node/21" media_library="Media Library">ege of Medi</a>cine's Arts and Humanities Program, that will help <strong>you stand out.</strong></p>
<blockquote>
<p>Blockquote <a href="/">Text</a> More text </p>
</blockquote>
<ul>
<li><a href="https://uiowa.edu">List item</a></li>
<li>List item</li>
</ul>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h6>Heading 6</h6>
<div aria-hidden="true" class="bttn bttn--outline bttn--sans-serif">
View Story
<i class="fas fa-arrow-right"></i>
</div>
</div>
</div>
</div>
<style>
@media (min-width: 855px) {
.card__row {
margin-right: 1.6rem;
margin-bottom: 0;
margin-left: 1.6rem
}
.card__row:first-of-type {
margin-left: 0
}
.card__row:last-of-type {
margin-right: 0
}
}
.card__wrapper {
margin: 1.25rem 1.25rem
}
@media (min-width: 855px) {
.card__wrapper {
padding: 1.25rem 3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
}
// ie11
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
.card__body {
flex: auto !important;
}
}
</style>
</div>
<style>
[class*="bg--"] {
min-height: 600px;
}
.container--padded {
padding: 40px;
}
</style>