<a class="skip-link" href="#main-content">Skip To Main Content</a>
<div class="off-canvas">
<div class="max-bound">
<header class="site-header site-header--ecosystem">
<div class="site-header__top">
<div class="site-header__logo-name-wrap">
<a href="https://www.iastate.edu/" class="site-header__logo">
<img src="https://cdn.theme.iastate.edu/img/iastate22/iowa-state-university-logo-no-tagline-red.svg" alt="Iowa State University" loading="lazy" width="224" height="17">
</a>
<a class="site-header__parent-unit-name" href="https://www.iastate.edu/">Parent Unit Name Lorem Ipsum</a> </div>
<div class="site-header__website-title"><a href="#">Website Title Lorem Ipsum Even Longer Lorem Ipsum</a></div>
<div class="site-header__utility-search-wrap">
<nav class="site-header__utility" aria-label="Utility">
<ul>
<li>
<a href="https://www.iastate.edu/">Util 1</a>
</li>
<li>
<a href="https://www.iastate.edu/">Util 2</a>
</li>
<li>
<a href="https://www.iastate.edu/">Util 3</a>
</li>
<li>
<a href="https://www.iastate.edu/">Util 4</a>
</li>
<li>
<a href="https://www.iastate.edu/">Util 5</a>
</li>
<li>
<a href="https://www.iastate.edu/">Sign Ons and Tools</a>
</li>
</ul>
</nav>
<div class="site-header__search">
<a href="#site-search" class="site-header__search-toggle">
<span class="visible-for-screen-readers">Search</span>
<span class="fak fa-iastate22-magnifying-glass" aria-hidden="true"></span>
</a>
<a href="#" class="site-header__search-close">
<span class="visible-for-screen-readers">Close Search</span>
<span class="fa-light fa-xmark"></span>
</a>
<form class="site-header__search-form-desktop">
<label class="visible-for-screen-readers" for="searchDesktop">Search</label>
<input type="search" id="searchDesktop" name="search" placeholder="Search">
<button type="submit"><span class="fak fa-iastate22-magnifying-glass" aria-hidden="true"></span><span class="visible-for-screen-readers">Submit Search</span></button>
</form>
</div>
<a class="site-header__utility-button" href="https://www.iastate.edu/">Button<span></span></a> </div>
</div>
<div class="site-header__main">
<a href="#site-header-mega-menu" class="site-header__mega-menu-open" role="button" aria-controls="site-header-mega-menu">
<span class="visible-for-screen-readers">Toggle Menu</span>
<span class="site-header__mega-menu-open-line-wrap">
<span></span>
<span></span>
<span></span>
</span>
</a>
<div class="site-header__mega-menu" id="site-header-mega-menu">
<div class="site-header__mega-menu-inner">
<div class="site-header__mega-menu-scroller">
<noscript>
<a href="#" role="button" class="nojs-close-menu">Close Main Menu</a>
</noscript>
<div>
<div class="site-header__mega-menu-main">
<div class="site-header__mega-menu-max-bound">
<div class="site-header__website-title"><a href="#">Website Title Lorem Ipsum Even Longer Lorem Ipsum</a></div>
<nav class="site-header__mega-menu-main-nav" aria-label="Main">
<ul>
<li>
<a href="https://www.iastate.edu/">Primary Nav 1</a>
<ul class="two-column-dropdown">
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Minim adipiscing, eu est adipiscing elit do minim.<span class="arrow"></span></a>
</li>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Tempor nulla velit lorem, ullamco quis qui non. Lorem ullamco quis, qui non eiusmod ullamco anim. Qui non eiusmod ullamco<span class="arrow"></span></a>
</li>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
</ul>
</li>
<li>
<a href="https://www.iastate.edu/">Primary Nav 2</a>
<ul>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
</ul>
</li>
<li>
<a href="https://www.iastate.edu/">Primary Nav 3</a>
<ul>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
</ul>
</li>
<li>
<a href="https://www.iastate.edu/">Primary Nav 4</a>
<ul>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
</ul>
</li>
<li>
<a href="https://www.iastate.edu/">Primary Nav 5</a>
<ul>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
</ul>
</li>
<li>
<a href="https://www.iastate.edu/">Primary Nav 6</a>
<ul>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
</ul>
</li>
<li>
<a href="https://www.iastate.edu/">Primary Nav 7</a>
<ul>
<li>
<a class="link-tertiary" href="https://www.iastate.edu/">Principles of Community<span class="arrow"></span></a>
</li>
</ul>
</li>
</ul>
</nav>
</div>
</div>
<div class="site-header__mega-menu-secondary">
<div class="site-header__mega-menu-max-bound">
<nav class="site-header__mega-menu-utility" aria-label="Utility">
<ul>
<li>
<a href="https://www.iastate.edu/">Util 1</a>
</li>
<li>
<a href="https://www.iastate.edu/">Util 2</a>
</li>
<li>
<a href="https://www.iastate.edu/">Util 3</a>
</li>
<li>
<a href="https://www.iastate.edu/">Util 4</a>
</li>
<li>
<a href="https://www.iastate.edu/">Util 5</a>
</li>
<li>
<a href="https://www.iastate.edu/">Sign Ons and Tools</a>
</li>
</ul>
<a class="site-header__utility-button" href="https://www.iastate.edu/">Button<span></span></a>
<form class="site-header__search-form-mobile">
<label class="visible-for-screen-readers" for="searchMobile">Search</label>
<input type="search" id="searchMobile" name="search" placeholder="Search">
<button type="submit"><span class="fak fa-iastate22-magnifying-glass" aria-hidden="true"></span><span class="visible-for-screen-readers">Submit Search</span></button>
</form>
</nav>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<main id="main-content">
<div class="outer-pad">
<div class="ecosystem-home-hero ecosystem-home-hero--atmospheric-image">
<div class="ecosystem-home-hero__media">
<img src="../../img/ecosystem-hero-featured_fpo.jpg" alt="" loading="lazy" width="2002" height="943">
</div>
<div class="ecosystem-home-hero__content">
<h1 class="ecosystem-home-hero__title">Hero Title Lorem Ipsum Dolor</h1>
<div class="iastate22-button-set">
<ul>
<li>
<a class="iastate22-button" href="https://iastate.edu">Button Label<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
<div class="text-content">
<h2>Heading 2 - This is a title of major section of a page</h2>
<p>Body copy….This should be used for any basic text, especially when writing in sentences. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
<h2>Heading 2 - This is a title of the next major section</h2>
<h3>Heading 3 - This is the title of a subsection of a page</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<h3>Heading 3 - This is the title of a subsection of a page</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor
sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut</p>
<ul>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</li>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.
<ul>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae.</li>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae.</li>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae.</li>
</ul>
</li>
</ul>
<ol>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</li>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</li>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</li>
</ol>
<p>Lorem ipsum dolor sit amet. <a href="#">Inline Text Link</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem
ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut</p>
</div>
<div class="paragraph-widget paragraph-widget--button-set">
<div class="iastate22-button-set">
<ul>
<li>
<a class="iastate22-button" href="https://iastate.edu">Button<span class="arrow"></span></a>
</li>
<li>
<a class="iastate22-button" href="https://iastate.edu">Another Button<span class="arrow"></span></a>
</li>
<li>
<a class="iastate22-button" href="https://iastate.edu">A Longer Button Lorem<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
<div class="paragraph-widget paragraph-widget--link-set">
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Secondary Link Style<span class="arrow"></span></a>
</li>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-external">External Link Style<span class="arrow"></span></a>
</li>
<li>
<a href="https://iastate.edu" class="link-set__link link-tertiary">Tertiary Link Style<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Heading 2 - This is a title of the next major section</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum
dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut</p>
</div>
</div>
<div class="paragraph-widget paragraph-widget--multicolumn-content">
<div class="multi-column-content">
<div class="multi-column-content__column">
<div class="text-content">
<h3>3-Column Heading Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </p>
</div>
</div>
<div class="multi-column-content__column">
<div class="text-content">
<h3>3-Column Heading Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </p>
</div>
</div>
<div class="multi-column-content__column">
<div class="text-content">
<h3>3-Column Heading Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </p>
</div>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--multicolumn-content">
<div class="multi-column-content">
<div class="multi-column-content__column">
<div class="text-content">
<h3>3-Column Heading Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </p>
</div>
</div>
<div class="multi-column-content__column">
<div class="text-content">
<h3>3-Column Heading Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </p>
</div>
</div>
<div class="multi-column-content__column">
<div class="text-content">
<h3>3-Column Heading Lorem</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </p>
</div>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Heading 2 - How Images Can Be Used</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est.</p>
<figure class="align-right">
<div class="media media--type-image media--view-mode-default">
<img src="../../img/IMG_Inline_Right_FPO.jpg" width="324" height="324" alt="">
</div>
<figcaption>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</figcaption>
</figure>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est Lorem ipsum dolor sit
amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet,
consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </p>
<figure class="align-left">
<div class="media media--type-image media--view-mode-default">
<img src="../../img/IMG_Inline_Left_FPO.jpg" width="324" height="324" alt="">
</div>
<figcaption>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</figcaption>
</figure>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est Lorem ipsum dolor sit
amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet,
consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
<figure class="align-center">
<div class="media media--type-image media--view-mode-default">
<img src="../../img/IMG-Inline_Center_FPO.jpg" width="736" height="451" alt="">
</div>
<figcaption>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</figcaption>
</figure>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est Lorem ipsum dolor sit
amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet,
consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<h2>Accordions</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--accordion">
<div class="accordion accordion-flush accordion--first-open" id="accordionFlush0">
<div class="accordion-item">
<h2 class="accordion-header" id="flush-heading0-1">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse0-1" aria-expanded="false" aria-controls="flush-collapse0-1">
Accordion Short Title
</button>
</h2>
<div id="flush-collapse0-1" class="accordion-collapse collapse" aria-labelledby="flush-heading0-1" data-bs-parent="#accordionFlush0">
<div class="accordion-body text-content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id
est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat.</p>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="flush-heading0-2">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse0-2" aria-expanded="false" aria-controls="flush-collapse0-2">
Accordion Short Title
</button>
</h2>
<div id="flush-collapse0-2" class="accordion-collapse collapse" aria-labelledby="flush-heading0-2" data-bs-parent="#accordionFlush0">
<div class="accordion-body text-content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id
est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat.</p>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="flush-heading0-3">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse0-3" aria-expanded="false" aria-controls="flush-collapse0-3">
Accordion Short Title
</button>
</h2>
<div id="flush-collapse0-3" class="accordion-collapse collapse" aria-labelledby="flush-heading0-3" data-bs-parent="#accordionFlush0">
<div class="accordion-body text-content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id
est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat.</p>
</div>
</div>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Inline Statistic</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--statistic-with-text">
<div class="statistic-with-text">
<div class="statistic">
<h2 class="statistics__label">Class of 2025 Profile</h2>
<ul>
<li>
<h3 class="statistic__title">X,XXX</h3>
<div class="statistic__text">Enrolled Students</div>
</li>
<li>
<h3 class="statistic__title">XX%</h3>
<div class="statistic__text">Out of State or International Students</div>
</li>
<li>
<h3 class="statistic__title">1 in 4</h3>
<div class="statistic__text">Students are Black, Asian, Hispanic or Multiracial</div>
</li>
</ul>
</div>
<div class="statistic-with-text__text text-content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--callout-with-image">
<div class="callout-with-image">
<div class="callout-with-image__media">
<img src="../../img/Component-Feature-Image-Small.jpg" alt="" width="622" height="414" loading="lazy">
</div>
<div class="callout-with-image__content text-content">
<h2>Heading 2 - This is a title of major section of a page</h2>
<div>
<p>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni lorem ipsem. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni
lorem ipsem.</p>
</div>
<a href="#" class="iastate22-button">Primary CTA Style<span class="arrow"></span></a> </div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Feature with H3 and 1 Small Image</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--callout-set">
<div class="callout-set">
<ul>
<li>
<div class="iastate22-callout">
<div class="iastate22-callout__media">
<img src="../../img/Component-Featured-Image-Small_FPO.jpg" alt="" width="622" height="414" loading="lazy">
</div>
<div class="iastate22-callout__content text-content">
<h3>Feature Title Lorem Ipsum Dolor</h3>
<div>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua.</div>
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Lorem Ipsum Dolor<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</li>
<li>
<div class="iastate22-callout">
<div class="iastate22-callout__media">
<img src="../../img/Component-Featured-Image-Small-2_FPO.jpg" alt="" width="622" height="414" loading="lazy">
</div>
<div class="iastate22-callout__content text-content">
<h3>Feature Title Lorem Ipsum Dolor</h3>
<div>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua.</div>
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Lorem Ipsum Dolor<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</li>
<li>
<div class="iastate22-callout">
<div class="iastate22-callout__media">
<img src="../../img/Component-Featured-Image-Small_FPO.jpg" alt="" width="622" height="414" loading="lazy">
</div>
<div class="iastate22-callout__content text-content">
<h3>Feature Title Lorem Ipsum Dolor</h3>
<div>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua.</div>
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Lorem Ipsum Dolor<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Feature with H3 and 2 Small Images</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--callout-set">
<div class="callout-set">
<ul>
<li>
<div class="iastate22-callout">
<div class="iastate22-callout__media">
<img src="../../img/Component-Featured-Image-Small_FPO.jpg" alt="" width="622" height="414" loading="lazy">
</div>
<div class="iastate22-callout__content text-content">
<h3>Feature Title Lorem Ipsum Dolor</h3>
<div>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua.</div>
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Lorem Ipsum Dolor<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</li>
<li>
<div class="iastate22-callout">
<div class="iastate22-callout__media">
<img src="../../img/Component-Featured-Image-Small-2_FPO.jpg" alt="" width="622" height="414" loading="lazy">
</div>
<div class="iastate22-callout__content text-content">
<h3>Feature Title Lorem Ipsum Dolor</h3>
<div>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua.</div>
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Lorem Ipsum Dolor<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</li>
<li>
<div class="iastate22-callout">
<div class="iastate22-callout__media">
<img src="../../img/Component-Featured-Image-Small_FPO.jpg" alt="" width="622" height="414" loading="lazy">
</div>
<div class="iastate22-callout__content text-content">
<h3>Feature Title Lorem Ipsum Dolor</h3>
<div>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua.</div>
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Lorem Ipsum Dolor<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Feature with H3 and 3 Small Images</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--callout-set">
<div class="callout-set">
<ul>
<li>
<div class="iastate22-callout">
<div class="iastate22-callout__media">
<img src="../../img/Component-Featured-Image-Small_FPO.jpg" alt="" width="622" height="414" loading="lazy">
</div>
<div class="iastate22-callout__content text-content">
<h3>Feature Title Lorem Ipsum Dolor</h3>
<div>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua.</div>
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Lorem Ipsum Dolor<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</li>
<li>
<div class="iastate22-callout">
<div class="iastate22-callout__media">
<img src="../../img/Component-Featured-Image-Small-2_FPO.jpg" alt="" width="622" height="414" loading="lazy">
</div>
<div class="iastate22-callout__content text-content">
<h3>Feature Title Lorem Ipsum Dolor</h3>
<div>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua.</div>
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Lorem Ipsum Dolor<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</li>
<li>
<div class="iastate22-callout">
<div class="iastate22-callout__media">
<img src="../../img/Component-Featured-Image-Small_FPO.jpg" alt="" width="622" height="414" loading="lazy">
</div>
<div class="iastate22-callout__content text-content">
<h3>Feature Title Lorem Ipsum Dolor</h3>
<div>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
magna aliqua.</div>
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Lorem Ipsum Dolor<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="paragraph-widget paragraph-widget--image-grid-with-text">
<div class="image-grid-with-text">
<div class="image-grid-with-text__content text-content">
<h2>Image Grid with H2 Title and CTA</h2>
<div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est
laborum.</p>
</div>
<div class="iastate22-button-set">
<ul>
<li>
<a class="iastate22-button" href="https://iastate.edu">Primary CTA Styles<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
<div class="image-grid">
<div class="image-grid__image">
<img src="../../img/IMG-Campus-Location-Large-Image.jpg" alt="" width="627" height="418" loading="lazy">
</div>
<div class="image-grid__image">
<img src="../../img/IMG-Campus-Location-Large-Image.jpg" alt="" width="303" height="202" loading="lazy">
</div>
<div class="image-grid__image">
<img src="../../img/IMG-Campus-Location-Large-Image.jpg" alt="" width="303" height="202" loading="lazy">
</div>
<div class="image-grid__caption">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Video</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--video-embed">
<div class="video-embed">
<div class="video-embed__media-wrap">
<img src="../../img/IMG-Inline_Center_FPO.jpg" alt="" />
<div class="video-embed__video" aria-label="YouTube Video: Your future starts now." data-vid="LjOmcZkXVcU"></div>
</div>
<div class="video-embed__caption">Video caption lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat.</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--link-block">
<div class="link-block">
<h2>Optional Subheading Lorem Ipsum Dolor</h2>
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Label Lorem Ipsum Dolor Sit<span class="arrow"></span></a>
</li>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Label Lorem Ipsum Dolor<span class="arrow"></span></a>
</li>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Label Lorem<span class="arrow"></span></a>
</li>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Name Lorem Ipsum<span class="arrow"></span></a>
</li>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Label Lorem Dolor<span class="arrow"></span></a>
</li>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-secondary">Link Label Lorem Ipsum Dolor<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--external-news-story">
<div class="external-news-story">
<h2>Optional Subheading External News/Story Feature</h2>
<div class="external-news-story__flex-wrap">
<div class="external-news-story__media">
<img src="../../img/Component-Feature-News-Story-Image.jpg" alt="" loading="lazy" width="608" height="404">
</div>
<div class="external-news-story__content text-content">
<h3>Headline Nemo enim irure dolor in reprehenderit in voluptate velit esse cillum dolore.</h3>
<p>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni lorem ipsem. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<div class="link-set">
<ul>
<li>
<a href="https://iastate.edu" class="link-set__link iastate22-link-external">External Link Style<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--blockquote">
<div class="iastate22-blockquote iastate22-blockquote--with-image">
<div class="iastate22-blockquote__inner-wrap">
<div class="iastate22-blockquote__portrait">
<img src="../../img/featured-quote.jpg" alt="" loading="lazy" width="258" height="258">
</div>
<div class="iastate22-blockquote__text-wrap">
<h2 class="iastate22-blockquote__quote">Lorem Ipsum Dolor Sit Amet duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur sit amet suis aut dolor.</h2>
<p class="iastate22-blockquote__author">FirstName LastName , Role
</p>
</div>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--blockquote paragraph-widget-no-margin-top paragraph-widget-no-margin-bottom">
<div class="iastate22-blockquote iastate22-blockquote--with-image">
<div class="iastate22-blockquote__inner-wrap">
<div class="iastate22-blockquote__portrait">
<img src="../../img/featured-quote.jpg" alt="" loading="lazy" width="258" height="258">
</div>
<div class="iastate22-blockquote__text-wrap">
<h2 class="iastate22-blockquote__quote">Lorem Ipsum Dolor Sit Amet duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur sit amet suis aut dolor.</h2>
<p class="iastate22-blockquote__author">FirstName LastName , Role
</p>
</div>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--feature-with-large-image paragraph-widget-no-margin-top paragraph-widget-no-margin-bottom">
<div class="feature-with-large-image">
<div class="feature-with-large-image__media">
<img src="../../img/feature_with_large_image.jpg" alt="" loading="lazy" width="1176" height="662">
</div>
<div class="feature-with-large-image__content">
<h2>Feature with H2 and Large Image</h2>
<div class="feature-with-large-image__text text-content">
<p>Nemo <a href="#">enim ipsam voluptatem quia</a> voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni lorem ipsem.</p>
</div>
<div class="iastate22-button-set">
<ul>
<li>
<a class="iastate22-button" href="https://iastate.edu">Primary CTA Style<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>3 Cards—with Images and Links</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--card-set">
<div class="card-set">
<ul>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-1.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/">Card Title Lorem Ipsum Dolor Sit Amet </a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta">Optional Link Text Lorem</a>
</div>
</div>
</li>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-2.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/" target="_blank">External Example - Card Title Lorem Ipsum</a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta" target="_blank">Optional Link Text Lorem</a>
</div>
</div>
</li>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-3.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/">Card Title Lorem Ipsum Dolor Sit Amet </a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta">Optional Link Text Lorem</a>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>6 Cards—with Images and Links</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--card-set">
<div class="card-set">
<ul>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-1.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/">Card Title Lorem Ipsum Dolor Sit Amet </a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta">Optional Link Text Lorem</a>
</div>
</div>
</li>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-2.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/" target="_blank">External Example - Card Title Lorem Ipsum</a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta" target="_blank">Optional Link Text Lorem</a>
</div>
</div>
</li>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-3.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/">Card Title Lorem Ipsum Dolor Sit Amet </a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta">Optional Link Text Lorem</a>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>3 Cards—with Images</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--card-set">
<div class="card-set">
<ul>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-1.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/">Card Title Lorem Ipsum Dolor Sit Amet </a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta">Optional Link Text Lorem</a>
</div>
</div>
</li>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-2.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/" target="_blank">External Example - Card Title Lorem Ipsum</a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta" target="_blank">Optional Link Text Lorem</a>
</div>
</div>
</li>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-3.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/">Card Title Lorem Ipsum Dolor Sit Amet </a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta">Optional Link Text Lorem</a>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>3 Cards—no Images and Links</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--card-set">
<div class="card-set">
<ul>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-1.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/">Card Title Lorem Ipsum Dolor Sit Amet </a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta">Optional Link Text Lorem</a>
</div>
</div>
</li>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-2.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/" target="_blank">External Example - Card Title Lorem Ipsum</a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta" target="_blank">Optional Link Text Lorem</a>
</div>
</div>
</li>
<li>
<div class="iastate22-card">
<div class="iastate22-card__media">
<img src="../../img/Component-Card-Image-3.jpg" alt="" loading="lazy" width="600" height="600">
</div>
<div class="iastate22-card__content">
<h2 class="iastate22-card__title">
<a href="https://www.iastate.edu/">Card Title Lorem Ipsum Dolor Sit Amet </a>
</h2>
<div class="iastate22-card__body text-content">
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</p>
</div>
<a href="https://www.iastate.edu/" class="iastate22-card__cta">Optional Link Text Lorem</a>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="paragraph-widget paragraph-widget--feature-with-large-image">
<div class="feature-with-large-image">
<div class="feature-with-large-image__media">
<img src="../../img/feature_with_large_image.jpg" alt="" loading="lazy" width="1176" height="662">
</div>
<div class="feature-with-large-image__content">
<h2>Feature with H2 and Large Image</h2>
<div class="feature-with-large-image__text text-content">
<p>Nemo <a href="#">enim ipsam voluptatem quia</a> voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni lorem ipsem.</p>
</div>
<div class="iastate22-button-set">
<ul>
<li>
<a class="iastate22-button" href="https://iastate.edu">Primary CTA Style<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--callout-inset">
<div class="callout-inset">
<div class="callout-inset_inset">
<h2 class="callout-inset_inset-headline">Inset Call Out with H2</h2>
<div class="text-content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat.</p>
</div>
</div>
<div class="feature-with-large-image">
<div class="feature-with-large-image__media">
<img src="../../img/Feature-Image-Inset-Large_FPO.jpg" alt="" loading="lazy" width="1176" height="662">
</div>
<div class="feature-with-large-image__content">
<h2>Inset Feature with H2 and Large Image</h2>
<div class="feature-with-large-image__text text-content">
<p>Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni lorem ipsem.</p>
</div>
<div class="iastate22-button-set">
<ul>
<li>
<a class="iastate22-button" href="https://iastate.edu">Primary CTA Style<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--call-to-action--small">
<div class="call-to-action call-to-action--small">
<div class="call-to-action__copy-wrap">
<h2 class="call-to-action__headline">Small Call to Action Voluptate Lorem Ipsum Dolor</h2>
<div>
<p>Nemo enim ipsam voluptatem quia voluptas.</p>
</div>
</div>
<div class="iastate22-button-set">
<ul>
<li>
<a class="iastate22-button" href="https://iastate.edu">Primary CTA Style<span class="arrow"></span></a>
</li>
<li>
<a class="iastate22-button" href="https://iastate.edu">Primary CTA Style<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
<div class="paragraph-widget paragraph-widget--call-to-action--large">
<div class="call-to-action call-to-action--large">
<div class="call-to-action__media">
<img src="../../img/CTA-Large-Image_FPO.jpg" alt="" loading="lazy" width="1713" height="641">
</div>
<div class="call-to-action__copy-wrap">
<h2 class="call-to-action__headline">Large Call to Action Voluptate Lorem</h2>
<div class="text-content">
<p>Nemo enim ipsam voluptatem quia voluptas.</p>
</div>
<div class="iastate22-button-set">
<ul>
<li>
<a class="iastate22-button" href="https://iastate.edu">Primary CTA Style<span class="arrow"></span></a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</main>
<footer class="site-footer site-footer--ecosystem">
<div class="site-footer__flex-wrap">
<div class="site-footer__logo-social-links-wrap">
<a href="https://www.iastate.edu" class="site-footer__logo">
<img src="https://cdn.theme.iastate.edu/img/iastate22/iowa-state-university-logo-with-tagline-sci-tech.svg" alt="Iowa State University of Science and Technology" loading="lazy" width="516" height="69">
</a>
<ul class="site-footer__social">
</ul>
</div>
<nav class="site-footer__primary-nav" aria-label="Footer Primary">
<ul>
<li>
<a href="#">Footer Link 1</a>
</li>
<li>
<a href="#">Footer Link 2</a>
</li>
<li>
<a href="#">Footer Link 3</a>
</li>
<li>
<a href="#">Footer Link 4</a>
</li>
<li>
<a href="#">Footer Link 5</a>
</li>
<li>
<a href="#">Footer Link 6</a>
</li>
</ul>
</nav>
<nav class="site-footer__secondary-nav" aria-label="Footer Secondary">
<h2 class="site-footer__section-label">Quick Links</h2>
<ul>
<li>
<a href="#">Quick Link 1</a>
</li>
<li>
<a href="#">Quick Link 2</a>
</li>
<li>
<a href="#">Quick Link 3</a>
</li>
<li>
<a href="#">Quick Link 4</a>
</li>
<li>
<a href="#">Quick Link 5</a>
</li>
<li>
<a href="#">Sign Ons and Tools</a>
</li>
</ul>
</nav>
</div>
<div class="site-footer__bottom-wrap">
<nav class="site-footer__utility-nav" aria-label="Footer Utility">
<ul>
<li>
<a href="https://www.iastate.edu/disclaimers-and-terms">Privacy Policy</a>
</li>
<li>
<a href="https://www.policy.iastate.edu/policy/discrimination">Non-discrimination Policy</a>
</li>
<li>
<a href="https://www.digitalaccess.iastate.edu/">Digital Access and Accessibility</a>
</li>
<li>
<a href="https://www.iastate.edu/consumer-information">Consumer Information</a>
</li>
</ul>
</nav>
<div class="site-footer__copyright">
<p>©Iowa State University of Science and Technology</p>
</div>
</div>
</footer>
</div>
</div>
<div class="privacy-consent" hidden>
<div class="privacy-consent__content">
This website uses cookies to measure traffic and improve your experience. Declining tracking cookies will set a single cookie to remember your preference. You can manage your cookie preference at any time and learn more by visiting our <a href="/privacy-policy">Privacy Policy</a>.
</div>
<div class="privacy-consent__buttons">
<button class="iastate22-button iastate22-button--reverse privacy-consent__accept" type="button">Accept<span class="arrow"></span></button>
<button class="iastate22-button iastate22-button--reverse privacy-consent__decline" type="button">Decline<span class="arrow"></span></button>
</div>
</div>
{% extends "@page" %}
{% block header %}
{% include "@site-header--ecosystem" %}
{% endblock %}
{% block content %}
<div class="outer-pad">
{% include "@ecosystem-home-hero--atmospheric-image" %}
<div class="text-content">
<h2>Heading 2 - This is a title of major section of a page</h2>
<p>Body copy….This should be used for any basic text, especially when writing in sentences. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
<h2>Heading 2 - This is a title of the next major section</h2>
<h3>Heading 3 - This is the title of a subsection of a page</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<h3>Heading 3 - This is the title of a subsection of a page</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut</p>
<ul>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</li>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.
<ul>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae.</li>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae.</li>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae.</li>
</ul>
</li>
</ul>
<ol>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</li>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</li>
<li>Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.</li>
</ol>
<p>Lorem ipsum dolor sit amet. <a href="#">Inline Text Link</a> elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut</p>
</div>
<div class="paragraph-widget paragraph-widget--button-set">
{% include "@button-set" with button_set %}
</div>
<div class="paragraph-widget paragraph-widget--link-set">
{% include "@link-set" with link_set %}
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Heading 2 - This is a title of the next major section</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut</p>
</div>
</div>
<div class="paragraph-widget paragraph-widget--multicolumn-content">
{% include "@multi-column-content" with three_column_text %}
</div>
<div class="paragraph-widget paragraph-widget--multicolumn-content">
{% include "@multi-column-content" with two_column_text %}
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Heading 2 - How Images Can Be Used</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est.</p>
{# Right aligned image with caption #}
<figure class="align-right">
<div class="media media--type-image media--view-mode-default">
<img src="{{ "../../img/IMG_Inline_Right_FPO.jpg"|path }}" width="324" height="324" alt="">
</div>
<figcaption>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</figcaption>
</figure>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p>Ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </p>
{# Left aligned image with caption #}
<figure class="align-left">
<div class="media media--type-image media--view-mode-default">
<img src="{{ "../../img/IMG_Inline_Left_FPO.jpg"|path }}" width="324" height="324" alt="">
</div>
<figcaption>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</figcaption>
</figure>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
{# Center aligned image with caption #}
<figure class="align-center">
<div class="media media--type-image media--view-mode-default">
<img src="{{ "../../img/IMG-Inline_Center_FPO.jpg"|path }}" width="736" height="451" alt="">
</div>
<figcaption>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur</figcaption>
</figure>
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<h2>Accordions</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--accordion">
{% include "@accordion" with accordion %}
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Inline Statistic</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--statistic-with-text">
{% include "@statistic" with statistic_with_text %}
</div>
<div class="paragraph-widget paragraph-widget--callout-with-image">
{% include "@feature-with-small-image" with callout_with_image %}
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Feature with H3 and 1 Small Image</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--callout-set">
{% include "@feature-set" with callout_with_image_small_set_one %}
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Feature with H3 and 2 Small Images</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--callout-set">
{% include "@feature-set" with callout_with_image_small_set_two %}
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Feature with H3 and 3 Small Images</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--callout-set">
{% include "@feature-set" with callout_with_image_small_set_three %}
</div>
<div class="paragraph-widget paragraph-widget--image-grid-with-text">
{% include "@image-grid-with-text" with image_grid_with_text %}
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>Video</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--video-embed">
{% include "@video-embed" with video_embed %}
</div>
<div class="paragraph-widget paragraph-widget--link-block">
{% include "@link-block" with link_block %}
</div>
<div class="paragraph-widget paragraph-widget--external-news-story">
{% include "@external-news-story" with external_news_story %}
</div>
<div class="paragraph-widget paragraph-widget--blockquote">
{% include "@blockquote" with pull_quote_no_author %}
</div>
<div class="paragraph-widget paragraph-widget--blockquote paragraph-widget-no-margin-top paragraph-widget-no-margin-bottom">
{% include "@blockquote" with pull_quote_with_author %}
</div>
{# Temporary to test flush spacing #}
<div class="paragraph-widget paragraph-widget--feature-with-large-image paragraph-widget-no-margin-top paragraph-widget-no-margin-bottom">
{% include "@feature-with-large-image" with feature_with_large_image %}
</div>
{# Temporary to test flush spacing #}
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>3 Cards—with Images and Links</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--card-set">
{% include "@card-set" with card_set_three_links %}
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>6 Cards—with Images and Links</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--card-set">
{% include "@card-set" with card_set_six %}
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>3 Cards—with Images</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--card-set">
{% include "@card-set" with card_set_three_no_links %}
</div>
<div class="paragraph-widget paragraph-widget--text-html">
<div class="text-content">
<h2>3 Cards—no Images and Links</h2>
</div>
</div>
<div class="paragraph-widget paragraph-widget--card-set">
{% include "@card-set" with card_set_three_links_no_images %}
</div>
<div class="paragraph-widget paragraph-widget--feature-with-large-image">
{% include "@feature-with-large-image" with feature_with_large_image %}
</div>
<div class="paragraph-widget paragraph-widget--callout-inset">
{% include "@feature-with-large-image-and-intro" with callout_inset %}
</div>
<div class="paragraph-widget paragraph-widget--call-to-action--small">
{% include "@call-to-action--small" with call_to_action_small %}
</div>
<div class="paragraph-widget paragraph-widget--call-to-action--large">
{% include "@call-to-action--large" with call_to_action_large %}
</div>
</div>
{% endblock %}
{% block footer %}
{% include "@site-footer--ecosystem" %}
{% endblock %}
{
"hero": {
"image": "../../img/ecosystem-hero-featured_fpo.jpg",
"title": "Hero Title Lorem Ipsum Dolor",
"button_set": {
"items": [
{
"text": "Button Label",
"url": "https://iastate.edu"
}
]
}
}
}
There are no notes for this item.