Content Area


2 Column Example

Sit similique nemo corporis omnis rerum voluptatem eius harum. Reiciendis aspernatur ut voluptatibus sunt. Dolorum impedit ut aut nobis nostrum. Repudiandae numquam et possimus dolor ut consectetur blanditiis.

Adipisci non est qui ut nulla porro aspernatur tenetur. Est illum aperiam iusto aspernatur dolores. Iure itaque incidunt soluta ea praesentium.

See Row/Columns Code
        
    <div class="row">
        <div class="small-12 large-6 columns">
            <p>Nihil ex fugit ut non qui officia est. Fugiat quos ea odit asperiores et. Reprehenderit voluptatem quidem in nihil id omnis ut incidunt.</p>
        </div>
        <div class="small-12 large-6 columns">
            <p>Velit explicabo error aliquam totam natus tenetur nam. Neque eum expedita voluptas provident optio aperiam. Eius et ut voluptatem distinctio porro illo aut. Expedita architecto qui quia iure itaque pariatur. Reprehenderit doloremque molestiae est atque.</p>
        </div>
    </div>
        
    

Accordion

  • Impedit id dolores aut occaecati molestias.

    Quo possimus sit nam quae qui odit et. Reiciendis vero sit sapiente mollitia enim non. Quaerat ipsa rerum corporis iusto. Occaecati odio inventore sapiente minus rerum sed.

  • Amet non est est repellat voluptas doloribus iure.

    Illum consequatur aut qui iure. Error nihil tenetur earum recusandae aliquam vel at. Provident vero provident ut suscipit. Saepe et ut doloribus placeat recusandae vero qui ab.

  • Commodi sit ipsa necessitatibus error.

    Itaque dolores ullam quae sit qui accusantium ratione. Ullam quas quasi quia labore provident ad aut. Asperiores consequatur nihil ex magnam reiciendis ad quasi.

  • Qui occaecati ipsam harum nisi.

    Beatae veniam quasi laboriosam eos quasi ea maxime consequuntur. Deleniti nam saepe itaque nisi tempora. Est molestiae sit alias iste quaerat enim corrupti. Ut reiciendis alias est.

  • Asperiores laborum rerum est omnis voluptas modi.

    Veritatis aut totam harum ex adipisci voluptate voluptates. Ducimus asperiores assumenda architecto. Aut rerum quibusdam ut exercitationem quo nisi.

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
Rylee Rice cecil22@yahoo.com
Antonietta Wolff tressa01@gmail.com
Allen Ward ttowne@yahoo.com
Elisa Roberts jstamm@monahan.com
Maximus Sporer kathryn.koelpin@hotmail.com
Kareem Daugherty ross52@yahoo.com
Lorena Stiedemann towne.sylvan@yahoo.com
Alanis Ankunding vhills@gmail.com
Tyrique Littel rgoldner@yahoo.com
Garrison Bashirian ratke.abagail@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

Nihil aut ullam voluptatum similique. A quas veritatis a eligendi corporis qui sint. Et voluptas ea aliquam velit minus. Harum autem exercitationem rerum ut et. Aliquid et sit commodi voluptatem quam omnis minus impedit. Praesentium perspiciatis fugiat similique et soluta. Tempora consequatur non iste delectus quia cum nulla. Tempore iste eum voluptas odit dolorem. Corrupti accusamus dicta vero illum tempora.

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: Architecto et illum quos autem nisi magni necessitatibus maiores.

H2: Fugiat velit quibusdam enim iusto amet quibusdam in.

H3: Nihil perspiciatis id dolores tempora qui.

H4: Ut et qui veritatis.

H5: Voluptate possimus necessitatibus nisi provident rem nisi recusandae.
H6: Voluptatem quia pariatur assumenda.

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