Content Area


2 Column Example

Ab aut laboriosam iste facere ipsa deserunt. Nemo sint qui molestiae facilis quisquam omnis. Deserunt expedita sunt eveniet ab.

Aut necessitatibus rerum aperiam magni aspernatur molestiae ut eos. Nulla ex aut aliquam ut quos laudantium. Eum consectetur ad eum itaque. Rerum veniam ipsam et occaecati rerum ut ut dolorum.

See Row/Columns Code
        
    <div class="row">
        <div class="small-12 large-6 columns">
            <p>Ipsa et eum tempora minus doloribus suscipit. Ad quia qui placeat facere. Repellat consequatur totam cupiditate dolorum sit aut perspiciatis. Autem rerum vel quisquam.</p>
        </div>
        <div class="small-12 large-6 columns">
            <p>Qui inventore eligendi consequatur aperiam molestiae recusandae impedit. Cupiditate sunt nihil ratione pariatur earum voluptates. Doloremque laborum dolor veniam laudantium et architecto odit.</p>
        </div>
    </div>
        
    

Accordion

See Accordion Code
    
<ul class="accordion">
    <li class="is-active">
        <a href="#panel1a">Accordion 1</a>
        <div id="panel1a">
            <p>Panel 1. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>
    </li>
    <li>
        <a href="#panel2a">Accordion 2</a>
        <div id="panel2a">
            <p>Panel 2. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>
    </li>
    <li>
        <a href="#panel3a">Accordion 3</a>
        <div id="panel3a">
            <p>Panel 3. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
        </div>
    </li>
</ul>
    
    

Table Stack

First Name Last Name Email
Renee Welch oreilly.mathilde@hotmail.com
Name Kreiger upton.dimitri@olson.com
Hermina Strosin mabel.simonis@yahoo.com
Shanon Bartell jwalsh@hotmail.com
Troy Murphy leo.cruickshank@gmail.com
Tiara Dietrich corkery.rosario@murazik.net
Kaelyn Hackett flossie07@mertz.com
Russel Connelly mmccullough@hotmail.com
Amira Gottlieb leannon.uriah@hammes.com
Devyn Rippin dawson.brown@gmail.com
See Table Code
    
<table class="table-stack">
    <thead>
        <tr>
            <th></th>
            <th></th>
            <th></th>
        </tr>
    </thead>

    <tbody>
        <tr valign="top">
            <td></td>
            <td></td>
            <td></td>
        </tr>
    </tbody>
</table>
    
    

Blockquote

Et qui ut iste ex dolores nostrum molestiae quas. Et non aut et quod culpa ut consequatur. Ut quo totam incidunt consequuntur iure. Est sit sequi ipsam qui repellat ipsam vitae tenetur. Mollitia rerum et dolores. Est ab accusantium et molestiae aut quis. Atque sunt vero qui recusandae est. Ut quia minus accusantium aspernatur. Omnis dolores voluptas culpa quis labore. Error veniam quaerat reiciendis cum dolor. Molestias animi aut vel reiciendis quam ea facilis voluptatem. Repellat a impedit quod.

Buttons

Standard Button Expanded Button See Button Code
    
<a href="http://foundation.zurb.com/sites/docs/button.html#basics" class="button">Standard Button</a>
<a href="http://foundation.zurb.com/sites/docs/button.html#sizing" class="button expanded">Expanded Button</a>
    
    

Headers

H1: Aliquam sed consequatur nostrum nesciunt magni unde.

H2: Necessitatibus quos vel nisi assumenda aspernatur.

H3: Aperiam sunt dolorem numquam voluptatem placeat aut.

H4: Praesentium qui quia laborum dolores amet voluptates.

H5: Nobis fuga mollitia aut omnis nemo.
H6: Ad earum dolore debitis enim ullam.

Maginific Pop-up

Any valid YouTube URL starting with youtu.be or youtube.com/watch will open a lightbox with the video.

View YouTube Video

See Maginific Pop-up Code
    
<p>
    <a href="//www.youtube.com/watch?v=guRgefesPXE">
        <img src="//i.wayne.edu/youtube/guRgefesPXE">
    </a>
</p>
    
    

Responsive Embed

To make sure embedded content maintains its aspect ratio as the width of the screen changes, wrap the iframe, object, embed, or video in a container with the .responsive-embed class.

See Responsive Embed Code
    
<div class="responsive-embed">
    <iframe width="420" height="315" src="//www.youtube.com/embed/guRgefesPXE" frameborder="0" allowfullscreen></iframe>
</div>
    
    
150 years in the heart of Detroit